使用Javascript保存数据

时间:2016-05-09 06:59:30

标签: javascript jquery json

这里我有一个弹出窗口,其中包含3列Text Area和Dropdown1以及Dropdown2。在这里,用户将输入数据输入文本区域,用户将选择下拉索引值。这里有一个" SAVE"按钮位于弹出窗口中。输入数据并选择下拉选项后,用户需要将此数据保存在服务器中。

Java脚本用于保存数据。

 <script type="text/javascript"> 
                $(document).ready(function () {
                    function savaasfile() {
                        //$("#savefile").click(function () {

                        var customer = document.getElementById("modaltable");
                        customer.name = $("[id*=textdata]").val();
                        customer.scramble = $("[id*=DropDownList2]").val();
                        customer.confirm = $("[id*=DropDownList1]").val();

                        $.ajax({
                            type: "POST",
                            url: "server path.txt",
                            data: JSON.stringify(customer),
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (data) {
                                $('#myModal').dialog("close");

                            }
                        });
                        //function openSaveModal() {
                        //    $('#myModal').modal('show');
                        //}
                        //  customer.preventDefault();

                    }
                });
            </script>

**Button code**

    <button runat="server" id="savefile" class="btn btn-primary" onclick="savaasfile()" >Save </button>

输入数据后,在尝试保存数据时,它没有执行任何操作。它会自动关闭。在调试代码时,它表示没有找到元素&#34;。上面的代码有什么问题。我必须做出哪些改变。

这是表格和弹出窗口的HTML代码

 <div id="myModal" class="modal fade" role="dialog" data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog">
                   <div class="modal-header" style="background-color: orangered; border-top-left-radius:4px; border-top-right-radius:4px;">
                 <div class="modal-body">
                    <table class="table .table-responsive" id="modaltable">
                        <thead>
                            <tr>
                                <th style="background-color: #333333; color: #FFFFFF;" colspan="1">Index Position</th>
                                <th style="background-color: #333333; color: #FFFFFF;">Type of Scrambler</th>
                                <th style="background-color: #333333; color: #FFFFFF;">Scrambling Required</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    <textarea class="form-control" id="textdata"></textarea></td>// input area
                                <td>
                                    <div class="dropdown">
                                        <asp:DropDownList ID="DropDownList2" runat="server" CssClass="selectpicker"> //dropdown index
                                            <asp:ListItem Text="Alpha-Numeric Scramble" /> 
                                            <asp:ListItem Text="Packed-Decimal Scramble" />
                                            <asp:ListItem Text="Date-Time Scrambler" />
                                        </asp:DropDownList>
                                    </div>
                                </td>
                                <td>
                                    <div class="dropdown"> //dropdown index
                                        <asp:DropDownList ID="DropDownList1" runat="server" CssClass="selectpicker">
                                            <asp:ListItem Text="Yes" />
                                            <asp:ListItem Text="No" />
                                        </asp:DropDownList>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <button runat="server" id="savefile" class="btn btn-primary" onclick="savaasfile()" >Save </button>
                </div>
            </div>
        </div>
    </div>

以下是Modal弹出窗口的完整代码,其中包含带有文本区域和2个下拉索引的表。并且它正在&#34; Save&#34;按钮。这里用户将输入数据。该数据需要存储在给定的路径中。

0 个答案:

没有答案