How to replace the html or the return value in ajax [duplicate]

252
November 22, 2016, at 12:49 PM

This question already has an answer here:

  • Replace content in div after successful ajax function 2 answers

How can i display the return result after ajax make an request.

So it can be a solution where i can just replace the table value or replace the page without being reloaded

<script>
    $(document).ready(function () {
        $("#searchform").on('submit', function (e) {
            $.ajax({
                url: '/home',
                type: 'post',
                data: {contentSearch: $('#contentSearch').val()},
                success: function (data) {
                // what should i do here so it replace the page and display
                // the result result without being reloaded
                },
                error: function(){
                alert('error!');
                }
            });
            });
            return false;
        });
    });
</script> 

Html code ---

<form method="post" id="searchform">
        <div align="center" class="col-md-10">
            <input  type="text" id= "contentSearch" name="contentSearch" >
        </div>
    <button type="submit" class="btn btn-default" id="submitSearch">
            Search
        </button>
</form>

and the result or the value should be display is rendering to the twig/html file as chrisvalues

return $this->render('MyBundle:Content:content.html.twig', array(
                    'chrisvalues' => $chrisvalues,
                        )
        );

The return value can be display in a table or just as a plain html as well. Where it will be replace overtime when we make a request with ajax

Anyone knows any solution to this problem !! Desperately need some help on this, thanks a lot in advanced

Answer 1

You can try this:

success: function (data) {
    $("#divId").html(data);
}

where divId is the id of the div, whose content want to be replaced with the returned data.

READ ALSO
Qtip2 mouse positioning bug with jquery &gt; 1.9 when use negative margin

Qtip2 mouse positioning bug with jquery > 1.9 when use negative margin

I use qTip2 for tooltip in my web application and since jquery 1. 9, the tooltip are no longer placed in the same place.

307
Javascript Div Scroll - Some Issues

Javascript Div Scroll - Some Issues

I copied this from another post, not blindly, I can see what it does but I can't think of a way to fix the problem. I am not really proficient in JavaScript but I can read this snippet.

347
Intel XDK: set href in sprite button

Intel XDK: set href in sprite button

I'm developing an application in Intel XDK and want to set the href of a sprite button via javascript. .

292
ccavenue IFRAME integration using php

ccavenue IFRAME integration using php

I am trying to integrate ccavenue IFRAME payment gateway into my wordpress website. The ccavenue integration is working well except the IFRAME doesnt happen.

484