仅当输入的日期不是星期日时才如何提交表单？

Question

以下HTML标记是用于插入日期的表单。

如果是星期天，则用户将无法提交表单，否则应正常提交表单。

但是，我没有提到表单动作和方法。

如何使用JavaScript做到这一点？

<html>
    <head></head>
    <body>
        <form>
            <table>
                <tr>
                    <td>Departing</td>
                    <td>Returning</td>
                </tr>
                <tr></tr>
                <tr>
                    <td>
                        <input type="date" name="departing" required>
                    </td>
                    <td>
                        <input type="date" name="returning" id="rtndate" required>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="submit" value="Cheack Availability">
                    </td>
                </tr>
            </table>
        </form>
    </body>
</html>

Answer 1

您可以从输入值使用getDay() ，这是一个简单的示例

现在更新，可与主要浏览器一起使用

 function whatsTheDay() { var inDat = document.getElementById('dateInput').value; var inDate = new Date(inDat) if(inDate.getDay() == 0){ // 0 = sunday , 1 = monday ..etc //alert('sunday'); // do any thing document.getElementById('submit').disabled = true; document.getElementById('submit').value = 'disabled'; document.getElementById('err').innerHTML ='sunday not allowed' }else{ //alert('not sunday'); document.getElementById('submit').value = 'submit'; document.getElementById('err').innerHTML = 'this day is allowed'; document.getElementById('submit').disabled = false; } } function sumitable(){ var inDate = document.getElementById('dateInput').valueAsDate; if(inDate.getDay() != 0){ document.forms["myform"].submit(); } }

 input{ display:block; margin:10px; width:200px; border-radius:15px 0 15px 0; border:none; padding:5px; border:solid 2px green; font-size:18px; color:green; } input#submit{ background:gold; }

 <form id="myform"> <input type="text" placeholder="user data"/> <input id="dateInput" type="date" onchange="whatsTheDay()"/> <input id="submit" type="submit" value="submit" onclick="sumitable"/> </form> <p id="err"></p>

Answer 2

基本上，这个想法是：

从字段中获取数据
将获取的数据传输到后端服务

您可以使用jQuery和PHP轻松实现：（要使用此代码，您必须将jQuery脚本集成到您站点的代码中： https : //code.jquery.com/jquery-1.11.3.min.js ）

Submit.js（jQuery）：

/ *从字段中获取数据并通过AJAX发布* /

//单击ID =“ button_submit”的按钮即可进行以下操作

$(document).on('click', '#button_submit', function () {

    //GET DEPARTING FIELD'S VALUE
    var departing = $("[name='departing']").val();

    //GET RETURNING FIELD'S VALUE
    var returning = $("[name='returning']").val();

    //FOR DEBUG CASES YOU CAN PRINT THE VALUES FOR THE CONSOLE (REMOVE OR COMMENT IT WHEN YOU DONE DEVELOPMENT)
    console.log('Departing date: ' + departing);
    console.log('Returning date: ' + returning);

    //OPTIONAL VALIDATION SCRIPT HERE

    //SEND THE DATA TO THE BACKEND SERVICE WITH AN AJAX POST
    $.ajax({
        url: '/path/to/your_form_processor.php', //URL OF THE BACKEND SERVICE (use PHP here)
        type: 'POST',
        data: {
            departing: departing,
            returning: returning
        } //FIRST TAG: Data name, SECOND TAG: Value
    })
        .done(function () {
        //YOU CAN PROVIDE FEEDBACK HERE ON A SUCCESSFUL POST
        console.log("success");            
    })
        .fail(function () {
        //OR YOU CAN PROVIDE FEEDBACK HERE ON A FAILED POST
        console.log("error");            
    });
});

在服务器端，您可以使用

$变量名= $ _ POST [ “数据名”];

方法。

your_form_processor.php（PHP）：

<?php
echo 'Departing date: ' . htmlspecialchars($_POST["departing"]) . '!';
echo '<br>'
echo 'Returning date: ' . htmlspecialchars($_POST["returning"]) . '!';
?>

您可以在JSFiddle上检查运行中的脚本： http : //jsfiddle.net/dizajner/gLt3e7bw/1/

编码愉快！

仅当输入的日期不是星期日时才如何提交表单？

问题描述

2 个解决方案

解决方案1
2 2015-07-29 01:14:30

解决方案2
0 2015-07-29 02:04:49

仅当输入的日期不是星期日时才如何提交表单？

问题描述

2 个解决方案

解决方案1 2 2015-07-29 01:14:30

解决方案2 0 2015-07-29 02:04:49

解决方案1
2 2015-07-29 01:14:30

解决方案2
0 2015-07-29 02:04:49