Javascript中的验证码 [英] Validation Code in Javascript

问题描述

大家好，

我的要求很简单。

*我的页面中有一个网格，有3列，从时间到时间。

*当我点击网格上方的按钮时，我必须打开一个模态弹出窗口。

*在弹出窗口中，我有4个下拉菜单 - 从小时，从分钟到小时和分钟。

*考虑一下，我选择08（从小时开始），40（从分钟开始）和09（到小时），20（到几分钟）。

* I单击添加按钮。弹出窗口关闭，上面选择的值在网格中填充为



FromTime ToTime

08-40 09-20


*现在，当我想输入另一组值时，我必须验证如下。

新时间应该大于已存在于网格中。 （第二组数据可以从09-20开始到..但是。）

*例如，如果我选择时间09-00到09-30，我应该得到一个警报，弹出窗口应该保持原样。当我输入正确的值（例如09-20到10-00）时，弹出窗口应该关闭，值应该添加到网格中。



有人可以给我一个这个解决方案？这很紧急，我的工作很危险..



P.S.我的代码，按照我想要的方式工作。

Hi all,
My requirement is simple.
* I have a grid in my page with 3 columns, From Time and To Time.
* When I click a button above the grid, I have got to open a modal popup window.
* In the popup, I have 4 dropdowns - From Hours, From Minutes, To Hours and To Minutes.
* Consider, I select 08(From Hours), 40(From Minutes) and 09(To Hours), 20(To Minutes.)
* I click the add button. The popup closes, and the above selected values are populated in the grid as

FromTime ToTime
08-40 09-20

* Now, when I want to enter another set of values, I have to validate as follows.
The new time should be more than the ones already present in the grid. (The 2nd set of data can start with 09-20 to .. though.)
* Example, if I choose times 09-00 to 09-30, I should get an alert and the popup should stay as it is. When I enter correct values(say 09-20 to 10-00) the popup should close and the values should be added to the grid.

Can someone provide me a solution for this? It is urgent, my job is at stake ..

P.S. My code, which doesn''t work the way I want it to.

function validateTime() {
            var table = document.getElementById('<%=gvTimeSlots.ClientID%>');
            var Row;
            var oldFromTime, oldToTime;
            var oldFT, oldTT;
            var oldFromHour, oldFromMin, oldToHour, oldToMin;
            var newFromHour, newFromMin, newToHour, newToMin;
            var newFromTime, newToTime;
                for (var i = 1; i < table.rows.length; i++) {
                Row = table.rows[i];
                oldFT = new Array();
                oldTT = new Array();
                oldFromTime = Row.cells[4].innerText;
                oldToTime = Row.cells[5].innerText;
                oldFT = oldFromTime.split("-");
                oldTT = oldToTime.split("-");
                oldFromHour = oldFT[0];
                oldFromMin = oldFT[1];
                oldToHour = oldTT[0];
                oldToMin = oldTT[1];
                oldFromTime = parseInt(oldFromHour * 60) + parseInt(oldFromMin);
                oldToTime = parseInt(oldToHour * 60) + parseInt(oldToMin);
                if(('<%= cboFromTimeHours.SelectedValue%>') >= 0 && (('<%= cboFromTimeHours.SelectedValue%>')) < 10){
                newFromHour = "0" + ('<%= cboFromTimeHours.SelectedValue%>');
                }
                else{
                newFromHour = ('<%= cboFromTimeHours.SelectedValue%>');
                }
                newFromMin = ('<%= cboFromTimeMins.SelectedValue%>');
                newFromTime = parseInt(newFromHour * 60) + parseInt(newFromMin);
                if (('<%= cboToTimeHours.SelectedValue%>') >= 0 && (('<%= cboToTimeHours.SelectedValue%>')) < 10) {
                newToHour = "0" + ('<%= cboToTimeHours.SelectedValue%>');
                }
                else {
                newToHour = ('<%= cboToTimeHours.SelectedValue%>');
                }
                newToMin = ('<%= cboToTimeMins.SelectedValue%>');
                newToTime = parseInt(newToHour * 60) + parseInt(newToMin);
                if (newFromHour < oldFromHour || newFromHour < oldToHour){
                    alert("do not add.");
                    return false;
                }
            }
        }

推荐答案

如果点击按钮只是添加一个新行，那么为什么每次都要循环遍历整个表来检查所有值？当然，您只需存储在全局变量中输入的最后一个值，并在每次输入新值时检查该值。



赞：

If clicking the button simply adds a new row, then why do you have to loop through the whole table every time to check all the values? Surely you can just store the last value entered in a global variable and check against that value every time a new one''s entered.

Like:

var oldToTime = 0;

function validateTime() {
    var NFH = document.getElementById('<%=cboFromTimeHours.ClientID%>');
    var NFM = document.getElementById('<%=cboFromTimeMins.ClientID%>');
    var NTH = document.getElementById('<%=cboToTimeHours.ClientID%>');
    var NTM = document.getElementById('<%=cboToTimeMins.ClientID%>');

    var newFromHour, newFromMin, newToHour, newToMin, newFromTime, newToTime;

    // now get the new 'from' time
    if ((NFH.options[NFH.selectedIndex].text >= 0) && (NFH.options[NFH.selectedIndex].text) < 10) {
        newFromHour = "0" + NFH.options[NFH.selectedIndex].text;
    }
    else {
        newFromHour = NFH.options[NFH.selectedIndex].text;
    }

    // and 'from' minutes
    newFromMin = NFM.options[NFM.selectedIndex].text;

    // combine to get minutes past midnight
    newFromTime = parseInt(newFromHour * 60) + parseInt(newFromMin);


    // now get the new 'to' time
    if ((NTH.options[NTH.selectedIndex].text >= 0) && (NTH.options[NTH.selectedIndex].text) < 10) {
        newToHour = "0" + NTH.options[NTH.selectedIndex].text;
    }
    else {
        newToHour = NTH.options[NTH.selectedIndex].text;
    }

    // and 'to' minutes
    newToMin = NTM.options[NTM.selectedIndex].text;

    // combine to get minutes past midnight
    newToTime = parseInt(newToHour * 60) + parseInt(newToMin);

    alert('new from:' + newFromTime + ', new to:' + newToTime + ', old:' + oldToTime);

    // check new times are valid
    if (!((newToTime > newFromTime) && (newFromTime >= oldToTime))) {
        alert("do not add.");
        return false;
    }
    else {
        alert('ok, time is valid');
        oldToTime = newToTime;
        return true;
    }
}

表格代码：

Form code:

<form runat="server">

    From H:<asp:DropDownList ID="cboFromTimeHours" DataValueField="TIME_ID" DataTextField="TIME_DESC" runat="server"></asp:DropDownList>
    <br />
    From M:<asp:DropDownList ID="cboFromTimeMins" DataValueField="TIME_ID" DataTextField="TIME_DESC" runat="server"></asp:DropDownList>
    <br />
    To H:<asp:DropDownList ID="cboToTimeHours" DataValueField="TIME_ID" DataTextField="TIME_DESC" runat="server"></asp:DropDownList>
    <br />
    To M:<asp:DropDownList ID="cboToTimeMins" DataValueField="TIME_ID" DataTextField="TIME_DESC" runat="server"></asp:DropDownList>
    <br />

    <asp:Button OnClientClick="validateTime(); return false;" Text="Click" runat="server"/>

</form>

代码背后：

Code behind:

protected void Page_Load(object sender, EventArgs e)
{
    DataTable dt;

    DataRow unSelected;

    dt = new DataTable();

    dt.Columns.Add("TIME_ID", typeof(String));
    dt.Columns.Add("TIME_DESC", typeof(String));

    for (int i = 1; i < 13; i++)
    {
        unSelected = dt.NewRow();
        unSelected["TIME_ID"] = i;
        unSelected["TIME_DESC"] = i;

        dt.Rows.InsertAt(unSelected, dt.Rows.Count);
    }

    cboFromTimeHours.DataSource = dt;
    cboFromTimeHours.DataBind();

    cboToTimeHours.DataSource = dt;
    cboToTimeHours.DataBind();

    dt = new DataTable();

    dt.Columns.Add("TIME_ID", typeof(String));
    dt.Columns.Add("TIME_DESC", typeof(String));

    for (int i = 0; i < 60; i++)
    {
        unSelected = dt.NewRow();
        unSelected["TIME_ID"] = i;
        unSelected["TIME_DESC"] = i;

        dt.Rows.InsertAt(unSelected, dt.Rows.Count);
    }

    cboFromTimeMins.DataSource = dt;
    cboFromTimeMins.DataBind();

    cboToTimeMins.DataSource = dt;
    cboToTimeMins.DataBind();
}

您确定要使用服务器值''<％= cboFromTimeHours.SelectedValue％>''在这里？你不想要选择实际价值吗？



祝你好运！

Are you really sure you want to use the server value ''<%= cboFromTimeHours.SelectedValue%>'' here? Don''t you want the actual value selected?

Good luck!

嗨Nijboer，这样会很好太..！但不知何故，我无法正确验证。这是完全失败。

Hi Nijboer, it would be good that way too..! But somehow I am not able to get the validation right. It is a total failure.

这篇关于Javascript中的验证码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！