【问题标题】:set TextBox value using Jquery where it has TextMode="date" property set使用 Jquery 设置 TextBox 值,其中设置了 TextMode="date" 属性
【发布时间】:2014-07-07 11:01:23
【问题描述】:

我有这个 textmode 属性设置为日期的文本框:

<asp:TextBox ID="dateBox" runat="server" TextMode="Date"></asp:TextBox>

我使用 AJAX 从我的 XML 文件中检索到我的 JS 函数的日期字符串:

$docDate = $(this).attr("date");

现在我已经验证了输入 XML 文件的日期,所以我只想将我的文本框值设置为我从 XML 文件中获得的日期,即现在的 $docDate。

我该怎么做?我试过使用 .val($docDate) 函数和其他东西,但它不适合我。

提前致谢!

顺便说一句,文本框看起来像这样:

根据要求,这是整个代码。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ControlPanel.aspx.cs" Inherits="ControlPanel" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <link rel="shortcut icon" href="Images/site_icon.ico" />
    <title>מבואת המזכירות</title>
    <link href="Style/CPStyle.css" rel="stylesheet" />
    <link href="Style/RecordsStyle.css" rel="stylesheet" />
    <script src="Scripts/Jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#idBox").change(function () {
                selectedID = $('#idBox').val();
                // מציאת נתוני הרשומה המבוקשת באמצעות אג'קס
                $.ajax({
                    type: "GET",
                    url: "LobbyFiles.xml",
                    dataType: "xml",
                    success: xmlParser
                });
            });
            function formatDateForInput(date) {
                var year = date.getFullYear();
                var month = ("0" + (date.getMonth() + 1)).slice(-2);
                var day = ("0" + date.getDate()).slice(-2);
                return String.format("{0}-{1}-{2}", year, month, day);
            }
            function xmlParser(xml) {
                // מציאת מספר רשומה מבוקש
                $docId = $('#idBox').val();
                // אתחול משתנים
                $docName = "";
                $docType = "";
                $docDate = "";
                $docLink = "";
                $docAuthor = "";
                $docPlce = "";

                foundNode = false;
                // מציאת הרשומה בעלת מספר רשומה המבוקש
                $(xml).find("link").each(function () {

                    $nodeId = $(this).attr("id");
                    if ($nodeId == $docId) {
                        foundNode = true;
                        // הכנסת ערכי הרשומה למשתנים המאותחלים
                        $docName = $(this).text();
                        $docType = $(this).attr("type");
                        $docAuthor = $(this).attr("author");
                        $docDate = $(this).attr("date");
                        $docLink = $(this).attr("url");
                        $docPlce = $(this).attr("place");
                        return false;
                    }
                });
                // לאחר הלולאה אם לא נמצאה רשומה בעלת מספר זה, יחזיר את הערך לאפס ויודיע למשתמש
                // במידה ויימצא - ייקח את כל הערכים הנמצאים במשתנים ויכניסם לטופס
                if (foundNode) {
                    $("#DocNameBox").val($docName);
                    $("#urlBox").val($docLink);
                    $("#placeBox").val($docPlce);
                    $("#authorNameBox").val($docAuthor);

                    switch ($docType) {
                        case "protocol":
                            $("#typeList").val("protocol");
                            break;
                        case "schedule":
                            $("#typeList").val("schedule");
                            break;
                        case "olympus":
                            $("#typeList").val("olympus");
                            break;
                        case "formalPaper":
                            $("#typeList").val("formalPaper");
                            break;
                    }

                    var id = "<%= dateBox.ClientID %>";
                    alert(id);
                    $("#" + id).val(formatDateForInput($docDate));
                }
                else {
                    $("#idBox").val("0");
                    alert("מספר רשומה מבוקש לא נמצא!");
                }
            }
            // פונקציה זו מקבלת את נתוני הרשומה ומטמיעה אותם בפקדי הדף
        });

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div> <a href="Records.aspx"><img class="linkIcon" src="Images/back.ico" /></a>
        <a href="Home.html"> <img id="homeIcon" src="Images/home.ico" class="linkIcon" /></a>
            <div id="main_wrapper">
                <h1>לוח ניהול המבואה</h1>
                <h5 id="details">
                    ניתן להוסיף רשומה חדשה למבואה - או לחילופין לעדכן רשומה קיימת. 
                     על מנת להוסיף רשומה חדשה - השאר את מספר המסמך על 0. 
                     כדי לעדכן רשומה קיימת - הכנס את מספר הרשומה שברצונך לעדכן.
                            </h5>              
            <asp:Label ID="status" runat="server" Text=""></asp:Label>
            <table>
                <tr>
                    <td>
                        מספר מסמך:
                    </td>
                    <td>
                        <asp:TextBox ID="idBox" runat="server" TextMode="Number" Text="0"></asp:TextBox>
                    </td>
                </tr>
                                <tr>
                    <td>
                        שם המסמך:
                    </td>
                    <td>
                        <asp:TextBox ID="DocNameBox" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        סוג המסמך:
                    </td>
                    <td>
                        <asp:DropDownList ID="typeList" runat="server">
                            <asp:ListItem Text="מסמך רשמי" Value="formalPaper" Enabled="true"></asp:ListItem>
                            <asp:ListItem Text="פרוטוקול/סיכום ישיבה" Value="protocol" Enabled="true"></asp:ListItem>
                            <asp:ListItem Text="מרכז תנועה/עולימפוס" Value="olympus" Enabled="true"></asp:ListItem>
                            <asp:ListItem Text="לוח זמנים" Value="schedule" Enabled="true"></asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>

                    <td>
                        קישור:
                    </td>
                    <td>
                        <asp:TextBox ID="urlBox" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>נכתב ע"י:</td>
                    <td>
                        <asp:TextBox ID="authorNameBox" runat="server"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>מקום כתיבה (להשאיר ריק אם לא במחנה):</td>
                    <td>
                        <asp:TextBox ID="placeBox" runat="server"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>בתאריך:</td>
                    <td>
                        <asp:TextBox ID="dateBox" runat="server" TextMode="Date"></asp:TextBox></td>
                </tr>
            </table>
            <asp:Button ID="Button1" runat="server" Text="הוסף נתונים לקובץ XML" OnClick="Button1_Click" />
        </div>
    </div>
    </form>
</body>
</html>

【问题讨论】:

  • 你能显示你的代码使用了 .val($docDate)
  • 如果您使用 .val 或使用 client id mode static,则需要使用 dateBox 的客户端 ID

标签: jquery validation date textbox


【解决方案1】:

它确实需要特定的格式才能工作 - 我自己也确实做过同样的事情。这是我用的...

function formatDateForInput(date) {
    var year = date.getFullYear();
    var month = ("0" + (date.getMonth() + 1)).slice(-2);
    var day = ("0" + date.getDate()).slice(-2);
    return String.format("{0}-{1}-{2}", year, month, day);
}

该函数只是将日期强制转换为正确的格式yyyy-mm-dd

然后你可以像这样将它应用到元素上......

$("[id$=dateBox]").val(formatDateForInput($docDate));

这是一个使用不同日期格式的工作和失败示例...

http://jsfiddle.net/CMxGR/1/

【讨论】:

    【解决方案2】:

    您需要使用clientID 来获取确切的元素。那么只有你可以使用.val("new value") 来设置值。试试这段代码,

    var id="<%= dateBox.ClientID %>";
    $("#"+id).val("new date here");
    

    【讨论】:

    • 问题在于没有选择正确的元素。值 必须 采用特定格式,控件才能接受它。看看我的回答,看看我的意思。这是一个例子:jsfiddle.net/CMxGR/1
    • @Archer 哦,我明白了。我对“我只想将我的文本框值设置为从 XML 文件中获取的日期”这一点感到困惑
    • @user2396866 是否设置了任何值?你能分享你的整个代码吗?
    • 我尝试了 Archer 的示例,它对我有用。其他例子没有。我会在一秒钟内分享我的代码是的
    • 我已经添加了代码。很多 cmets 和文本都是希伯来语,我希望你不会介意 :)
    猜你喜欢
    • 1970-01-01
    • 2014-03-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-01
    相关资源
    最近更新 更多