Jquery ajax call from datepicker onSelect disappears textbox

Question

I have a textbox with datepicker jquery plugin. When i select a date ,post ajax call is made and i want to return some data from database and textbox should remain on top of the page so that furthur requests can also be made.

    <script>
        $(document).ready(function(){
        //create date pickers
            $("#datepicker").datepicker(
            { 
                changeMonth: true,
                changeYear: true,
                dateFormat: 'yy-mm-dd',
                onSelect: function(date)
                {
                    $.ajax({
                        type:"POST",
                        url:"seestuffs.php",
                        data:date,
                        success: function(result)
                        {
                              document.write(result);
                        }
                    });
                }
            });
        });
    </script>
    <body>
<p>Date: <input type="text" id="datepicker" name="date" /></p><br/>
    </body>

And here is my seestuffs.php

<?php 

if(isset($_POST['date']))
{
    $date = $_POST['date'];
    echo 'hello';

}


?>

But hello is not displayed on the page.Where am I going wrong!!Thanx in advance..

Your js and php are in the same path? otherwise your url is wrong in ajax method. — Donovan Charpin, Sep 21 '13 at 11:58

score 2 · Accepted Answer · edited May 23 '17 at 12:31

2

document.write will create a new document if called on a document that has already loaded. This is explained in this Question: JavaScript Document.Write Replaces All Body Content When Using AJAX.

So instead you need to add the result to the document either by appending a new node or using innerHTML eg:

success: function(result) {
   $('body').append('<p>'+result+'</p>');
}

edited May 23 '17 at 12:31

Community

1
1

answered Sep 21 '13 at 12:48

Petra Stone

109
4

2

I made an new div element hidden previously and den this two statements in success function: – user2801952 Sep 21 '13 at 17:08
2

document.getElementById('display').style.display = ""; document.getElementById('display').innerHTML = result; – user2801952 Sep 21 '13 at 17:10

Jquery ajax call from datepicker onSelect disappears textbox

1 Answers1