dsflxcfuw27742248
2017-01-21 15:03
浏览 22

Ajax响应为HTML

When the submit button is clicked on page1.php the response is printed as HTML format for a moment but it gets automatically deleted.

I want to display the response of page2.php in page1 in the id="output" element.

What am I doing wrong?

Here is the content of page1.php

<script type="text/javascript">
    function func(tosearch) {
        alert("search");

        $.ajax({
            type: 'post',
            url: 'page2.php',
            data: {
                'tosearch' : tosearch
            },
            success: function(result) {
                print(result);
            }
        });
    }

    function print(result) {
        document.getElementById("output").innerHTML=result;
    }
</script>

<form method="post" action="page1.php">
    <input type="text" name="search" placeholder="Search.."><br><br>
    <input type="submit" name="submit" onclick="func()">
</form>
<p id="output">table here!!</p>

Content of page2.php

<?php echo "<table align='center'>"
    ."<tr>"
    ."<td>"."Mr XYZ"."</td>"
    ."<td>"."MALE"."</td>"
    ."<td>"."987558745"."</td>"
    ."<td>"."xyz@gmail.com"."</td>"
    ."</tr>";
?>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • drasv0904 2017-01-21 15:06
    已采纳

    The response isn't being deleted, the page is refreshing. Since you don't want the page to refresh at all, you don't really need that form element. Just remove the form and make the input a plain button to keep the markup simple:

    <script>
        // your JavaScript
    </script>
    <input type="text" name="search" placeholder="Search.."><br><br>
    <button onclick="func()">    
    <p id="output">table here!!</p>
    
    点赞 评论

相关推荐 更多相似问题