AJAX and PHP

[mudradi.mohan]

Hi All, I am new to this POST.

 

I am having  problem in AJAX, PHP.

I am using a PHP form and I am using AJAX in Javascript. I submit the form once, the request goes to server performs actions and the control comes back to the form. But when I try to click submit button, it doesn't do any action. I need to reload the page in order to work with the form. Can an one help me?

 

Thanks in advance,

Mohan Rao Mudradi.

[trq]

We can't help without seeing relevant code.

[mudradi.mohan]

Hi, This is the Javascript code. The user picks up a date from the date picker and clicks the 'Apply' button for which this is the javascript code. It then submits the form to action php where the date is set and the output is displayed back in the main form. The problem is, I can set the date only once. I need to refresh the page if I want to set the date again.

 

//This is the function which is executed when the user clicks the 'Apply' button on the form
function validate_date_time_form()
{
        var waitid = document.getElementById('wait');

        var options = document.getElementsByName('set_mode');
        var date_val = document.set_time.new_date.value;

        for (var i = 0;  i < options.length;  i++)
        {
                if (options[i].checked)
                {
                        if (options[i].value == 'manual')
                        {
                                if (date_val == '')
                                {
                                        alert('Please choose a date from the date picker!');
                                        return false;
                                }

                                else
                                {
                                        var date_pattern = /^(\d{1,2})\-(\d{1,2})\-(\d{4})\ (\d{1,2})\d{1,2})\d{1,2})$/;
                                        correct_date = date_val.match(date_pattern);

                                        if (correct_date == null)
                                        {
                                                alert('Please enter date in proper format!');
                                                document.set_time.new_date.value = '';
                                                return false;
                                        }

                                        else
                                        {
                                                waitid.style.display = 'block';

[b]						//Form submission part. Date time is set in the set_date_time.php file and returns the output to the form.
                                                $.ajax(
                                                {
                                                        type: 'POST',
                                                        url: 'set_date_time.php',
                                                        data: 'new_date='+date_val+'&mode=manual&hid_curdate='+document.set_time.hid_curdate.value+'&hid_curtime='+document.set_time.hid_curtime.value,

                                                        success: function(html)
                                                        {
                                                                $('#response').html(html);
                                                        }
                                                });[/b]
                                        }
                                }
                        }

                        else if (options[i].value == 'pc_time')
                        {
                                var cur_date = new Date();

                                var date  = cur_date.getDate();
                                var month = cur_date.getMonth() + 1;
                                var year  = cur_date.getFullYear();
                                var hours = cur_date.getHours();
                                var mins  = cur_date.getMinutes();
                                var secn  = cur_date.getSeconds();

                                var cur_date_time = date+'-'+month+'-'+year+' '+hours+':'+mins+':'+secn;
                                document.set_time.hid_pc_time.value = cur_date_time;

[b]				//Form submission part. Date time is set in the set_date_time.php file and returns the output to the form.
                                $.ajax(
                                {
                                        type: 'POST',
                                        url: 'set_date_time.php',
                                        data: 'hid_pc_time='+cur_date_time+'&mode=pc_time',

                                        success: function(html)
                                        {
                                                $('#response').html(html);
                                        }
                                });[/b]
                        }
                }
        }
}

 

This is the code of the php form where the user chooses the date:

                <table width = "550" border = "0" cellspacing = "0" cellpadding = "0">
                        <tr>
                                <td height = "33px" width = "8" align = "left">
                                        <img src = "../images/rightside_left.jpg" width = "8" height = "33" />
                                </td>
                                <td width = "550" height = "33px" align = "left" valign = "middle" class = "right_bg rightsidemenuheading">
                                        <a class = 'link' href = 'set_time_help.php' onclick = "window.open('set_time_help.php', 'help', 'location = no, height = 500, width = 600'); return false;"><?= $image_icon ?></a>
                                        Date/Time Settings
                                </td>
                                <td height = "33px" width = "8" align = "right">
                                        <img src = "../images/rightside_right.jpg" />
                                </td>
                        </tr>
                        <tr>
                                <td colspan = "3" align = "left" valign = "top">
                                        <table width = "550" border = "0" cellspacing = "0" cellpadding = "0" class="outer_border"  bgcol:eor = "#f5f5f5">
                                                <tr>
                                                        <td class = 'table_content' colspan = '3' align = 'center'>
                                                                <BR><label>Current Date/Time: <?= $current_date ?> / <?= $current_time ?></label>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td colspan = '2' class = "table_heading">
                                                                <input class = "table_heading"  type = 'radio' name = 'set_mode' <?= $manual_selected ?> value = 'manual' onclick = 'return show_date_time();'><B>Manual</B>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td width = '10%'>
                                                        </td>
                                                        <td colspan = '2'>
                                                                <div id = 'id_set_time' style = 'width: 90%; background: #f5f5f5; display: <?= $manual_style ?>; border: 0px solid;'><BR>
                                                                <table style = 'font-weight: bold;'bgcolor = "#f5f5f5">
                                                                        <tr>
                                                                                <td class = "table_heading">
                                                                                        New Date
                                                                                </td>
                                                                                <td>
                                                                                        <input class = 'textbox' type = 'text' name = 'new_date' value = '' readonly>  <a href="javascript:show_calendar('document.set_time.new_date', document.set_time.new_date.value, 'settime');"><img src = '../images/cal.gif' style = 'border: 1px solid darkgrey;' /></a>
                                                                                </td>
                                                                        </tr>
                                                                        <tr>
                                                                                <td bgcolor = "#f5f5f5" class = "table_heading">
                                                                                        <BR>Select a time zone
                                                                                </td>
                                                                                <td bgcolor = "#f5f5f5" class="table_content">
                                                                                        <BR><select class = "table_content" name="DropDownTimezone" id="DropDownTimezone">
                                                                                                <option value="IST">Mumbai, Kolkata, Chennai, New Delhi</option>
                                                                                        </select>
                                                                                </td>
                                                                        </tr>
                                                                </table>
                                                                </div>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td colspan = '2' class = "table_heading">
                                                                <BR><input type = 'radio' name = 'set_mode' <?= $pc_time_selected ?> value = 'pc_time' onclick = 'return show_date_time();'><B>Use this PC time</B>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td class = "table_heading" colspan = '2'>
                                                                <BR><input type = 'radio' name = 'set_mode' <?= $ntp_selected ?> value = 'ntp_time' onclick = 'return show_date_time();'><B>NTP Server</B>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td width = '10%'>
                                                        </td>
                                                        <td colspan = '2'>
                                                                <div id = 'id_ntp_time' style = 'width: 90%; font-weight: bold; display: <?= $ntp_style ?>; background: #f5f5f5; border: 0px solid;'><BR>
                                                                <table style = 'font-weight: bold;' bgcolor = "#f5f5f5">
                                                                        <tr>
                                                                                <td class = "table_heading" bgcolor = "#f5f5f5">
                                                                                        NTP Server
                                                                                </td>
                                                                                <td>
                                                                                        <input class = 'input' type = 'text' name = 'ntp_server' size = '30' value = '<?= $ntp_server_val ?>' oninput = 'document.getElementById("id_sync_ntp").checked = false; document.set_time.action_but.disabled = true;'>
                                                                                </td>
                                                                        </tr>
                                                                        <tr>
                                                                                <td class = "table_heading">
                                                                                        <BR><input id = 'id_sync_ntp' type = 'checkbox' name = 'synch_ntp' onclick = 'return run_ntp_sync(this.form.synch_ntp.checked);' <?= $sync_checked ?>>Sync. now
                                                                                </td>
                                                                        </tr>
                                                                </table>
                                                                </div>

                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td colspan = '3' align = 'right'>
                                                                        <BR><input class = "input1" type = 'button' name = 'action_but' value = 'Apply' onclick = 'return validate_date_time_form();' style = 'margin-right: 1%; margin-bottom: 1%;'>
                                                                <input type = 'hidden' name = 'hid_time' value = '<?= $current_time ?>'>
                                                                <input type = 'hidden' name = 'set_date_page' value = 'proceed'>
                                                                <input type = 'hidden' name = 'hid_curdate' value = '<?= $current_date ?>'>
                                                                <input type = 'hidden' name = 'hid_curtime' value = '<?= $current_time ?>'>
                                                                <input type = 'hidden' name = 'hid_session_user' value = '<?= $session_user ?>'>
                                                                <input type = 'hidden' name = 'hid_pc_time' value = ''>
                                                        </td>
                                                </tr>
                                        </table>
                                        </form>
                                        </table><br /><br /><br />

 

I am able to set the date and the output is displayed in the mentioned div. But I can't do it again unless I reload the page