locked
make text empty in form after submit ajax RRS feed

  • Question

  • User2131089582 posted

    I have a ajax that call action in my controller so when i enter submit it will not redirect or prevent default behaviour of action below is my ajax call 

     $(function () {
                $(document).on('submit', '#OptionForm', refreshGrid);
            });
            var refreshGrid = function () {
                $.ajax({
                    url: this.action,
                    type: this.method,
                    data: $(this).serialize(),
                    success: function (data) {
                        //Do Something
                    }
                });
    
                return false;
            }

    and here is my input form 

      @using(Html.BeginForm("Send","Message",new { username = ViewBag.username },FormMethod.Post,new { id = "OptionForm" }))
                  {
                        @Html.AntiForgeryToken()
    
                        <div class="type_msg">
                            <div class="input_msg_write">
                                @Html.EditorFor(model => model.NewMessage.Content,
                                    new { htmlAttributes = new { @class = "write_msg",@placeholder = "Type a message to " + ViewBag.info +"..." } })
                            </div>
                        </div>
                    }

    everything work as expected after submit form, it will prevent default behaviour of my controller, My problem is when i submit the text in editor form don't remove, i mean i want to make editor or input empty after i submit form, how can i do that Thanks

    Wednesday, January 23, 2019 2:53 PM

Answers

  • User-2054057000 posted

    You are using a jQuery AJAX method request 

    $.ajax({
        url: this.action,
        type: this.method,
        data: $(this).serialize(),
        success: function (data) {
            //Do Something
        }
    });

    Inside the success callback you can reset the values of all text boxes using jQuery like this:

    success: function (data) {
        $("input[type='text']").val("");
    }
    

    The $("input[type='text']") is the selector for all input controls of type text in the page. And you can use .val() method to set the value inside them to empty.

    Thanks & Regards

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 23, 2019 3:25 PM

All replies

  • User-474980206 posted

    In the Ajax success callback, add code to clear the text box, or use form.reset()

    Wednesday, January 23, 2019 2:59 PM
  • User2131089582 posted

    Thanks for your respond how do i do that, cause i;m new in ajax

    Wednesday, January 23, 2019 3:03 PM
  • User-2054057000 posted

    You are using a jQuery AJAX method request 

    $.ajax({
        url: this.action,
        type: this.method,
        data: $(this).serialize(),
        success: function (data) {
            //Do Something
        }
    });

    Inside the success callback you can reset the values of all text boxes using jQuery like this:

    success: function (data) {
        $("input[type='text']").val("");
    }
    

    The $("input[type='text']") is the selector for all input controls of type text in the page. And you can use .val() method to set the value inside them to empty.

    Thanks & Regards

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 23, 2019 3:25 PM
  • User2131089582 posted

    noce thanks for your answer

    Wednesday, January 23, 2019 3:49 PM