Jquery with Ajax to update same PHP page

Asked

Viewed 985 times

1

I have a page called php form. which has the following code:

if(isset($_POST['date'])){
            $date = ($_POST['date']);
    echo "Data: ".$date;
}

The page also has a form with a Jquery datepicker:

<form id="myform" name="myform">
    <input type="text" id="datepicker" name="datepicker"/>
</form>

And also the JS code:

$(function() {
   $( "#datepicker" ).datepicker({
    minDate: 0, 
    onSelect: function(dateText, inst) {
        $.ajax({
            type: 'POST',
            data: {date : dateText},
            success: function(resp){
                if(false !== resp){
                    alert(dateText);
                }
            }
        });
    }
});
  });

When I select the date on the datepicker, javascript Alert works fine. Even so, the isset PHP always returns false. That is, for some reason Ajax is not reloading the page with the value of $_POST. Is there any problem in the above code or some but effective method of making this variable passage?

The result of the variable Resp is:

<html lang="en">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">




    <meta charset="utf-8"/>
    <title>Dashboard I Admin Panel</title>






    <link rel="stylesheet" href="css/layout.css" type="text/css" media="screen" />
    <!--[if lt IE 9]>
    <link rel="stylesheet" href="css/ie.css" type="text/css" media="screen" />
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="jquery-ui-1.11.4.custom/jquery-ui.css" />

    <!-- Load jQuery JS -->
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <!-- Load jQuery UI Main JS  -->
    <script src="jquery-ui-1.11.4.custom/jquery-ui.js"></script>

    <!-- Load SCRIPT.JS which will create datepicker for input field  -->


        <script type="text/javascript">
$(function() {
   $( "#datepicker" ).datepicker({
    minDate: 0, 
    onSelect: function(dateText, inst) {
        $.ajax({
            type: 'POST',
            data: {date : dateText},
            success: function(resp){
                alert(resp);

            }
        });
    }
});
  });

</script>

</head>


<body>
    <span id="hoverdata"></span>
    <header id="header">
        <hgroup>
            <h1 class="site_title"><a href="index.html">Website Admin</a></h1>
            <h2 class="section_title">Dashboard</h2><div class="btn_view_site"><a href="http://www.medialoot.com">View Site</a></div>
        </hgroup>
    </header> <!-- end of header bar -->

    <section id="secondary_bar">
        <div class="user">
            <p>John Doe (<a href="#">3 Messages</a>)</p>
            <!-- <a class="logout_user" href="#" title="Logout">Logout</a> -->
        </div>
        <div class="breadcrumbs_container">
            <article class="breadcrumbs"><a href="index.html">Website Admin</a> <div class="breadcrumb_divider"></div> <a class="current">Dashboard</a></article>
        </div>
    </section><!-- end of secondary bar -->

    <aside id="sidebar" class="column">

        <form class="quick_search">

            <input type="text" value="Quick Search" onfocus="if(!this._haschanged){this.value=''};this._haschanged=true;">

        </form>

        <hr/>

        <h3>Content</h3>

        <ul class="toggle">

            <li class="icn_new_article"><a href="#">New Article</a></li>

            <li class="icn_edit_article"><a href="#">Edit Articles</a></li>

            <li class="icn_categories"><a href="#">Categories</a></li>

            <li class="icn_tags"><a href="#">Tags</a></li>

        </ul>

        <h3>Módulos de Avaliação</h3>

        <ul class="toggle">

            <li class="stats_graph"><a href="#">New Article</a></li>

            <li class="icn_edit_article"><a href="#">Edit Articles</a></li>

            <li class="icn_categories"><a href="#">Categories</a></li>

            <li class="icn_tags"><a href="#">Tags</a></li>

        </ul>

        <h3>Users</h3>

        <ul class="toggle">

            <li class="icn_add_user"><a href="#">Add New User</a></li>

            <li class="icn_view_users"><a href="#">View Users</a></li>

            <li class="icn_profile"><a href="#">Your Profile</a></li>

        </ul>

        <h3>Media</h3>

        <ul class="toggle">

            <li class="icn_folder"><a href="#">File Manager</a></li>

            <li class="icn_photo"><a href="#">Gallery</a></li>

            <li class="icn_audio"><a href="#">Audio</a></li>

            <li class="icn_video"><a href="#">Video</a></li>

        </ul>

        <h3>Admin</h3>

        <ul class="toggle">

            <li class="icn_settings"><a href="#">Options</a></li>

            <li class="icn_security"><a href="#">Security</a></li>

            <li class="icn_jump_back"><a href="#">Logout</a></li>

        </ul>



        <footer>

            <hr />

            <p><strong>Copyright &copy; 2011 Website Admin</strong></p>

            <p>Theme by <a href="http://www.medialoot.com">MediaLoot</a></p>

        </footer>

    </aside><!-- end of sidebar -->Array
(
    [date] => 03/24/2016
)
Data: <span id='a-data'>03/24/2016</span>   
    <section id="main" class="column">
        <form id="myform" name="myform">
            <input type="text" id="datepicker" name="datepicker"/>
            <input type="button" id="submitMe">
        </form>

        <div class="spacer"></div>
    </section>


</body>

</html>

Thank you.

  • I don’t think you’re showing enough code to replicate the problem, but I’d trade echo for echo "Data: <span id='a-data'>". $date . "</span>"; and manipulated span with the result.

  • already pass the parameter by GET to see if it will? Sometimes there may be some problem when sending by POST

  • At the beginning of your PHP gives a print_r($_POST) and in the ajax Success before "if" puts console.log(Resp) to see in the Chrome console what is actually returning.

  • @brasofilo the rest of the code is pure html, I don’t know if it would influence this problem, but I can update the question with it. As for <span>, I didn’t quite understand what its purpose was.

  • @Brumazzid.B. GET or POST happens the same thing, with no result in either.

  • @Andrévicente I updated the question with the result of Resp. Apparently in Resp it processes php correctly.

  • It is returning correctly, the ajax takes everything you have on the page. If you have a form on the page and html codes will come all the same. It’s even bringing the print_r with the date array with the date you chose. It would be better if you made a php page the part just to work with your form, create a page, for example "form.php" and put in the call ajax url: "form.php", ai vc will be able to work with the date correctly

Show 2 more comments
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.