如何在asp.net中使用json autocomplete将jquery提取的数据库插入值

时间:2014-11-13 13:29:03

标签: c# jquery asp.net json database

可能会回应谁,

我们正在尝试将数据插入到Oracle DBMS中,由JSON通过调用asp.net webservices获取。 这里,aspx页面是另一个stackoverflow答案的修改代码。我们是否必须再次使用JSON将值发送到codebehind?如果是这样,怎么样?
感谢http://www.codingfusion.com/Post/Jquery-JSON-Add-Edit-Update-Delete-in-Asp-Net获取示例脚本

感谢您的关注

   <%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
        CodeBehind="Default.aspx.cs" Inherits="test7._Default" %>
    <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    </asp:Content>
    <asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
        <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
            <Scripts>
                <asp:ScriptReference Path="Scripts/jquery-1.11.1.min.js" />
                <asp:ScriptReference Path="Scripts/jquery-ui.min.js" />
            </Scripts>
        </asp:ScriptManagerProxy>
        <div id="outer" style="width: 100%; background-color: #737CA1">
            <div id="HeadDiv" style="width: 90%; background-color: #737CA1">
                <script type="text/javascript" id="ButceList">
                    $(function () {
                        $("#txtButce").autocomplete({
                            source: function (request, response) {
                                var param = { prefixText: $('#txtButce').val() };
                                $.ajax({
                                    url: "Default.aspx/GetButce",
                                    data: JSON.stringify(param),
                                    dataType: "json",
                                    type: "POST",
                                    contentType: "application/json; charset=utf-8",
                                    dataFilter: function (data) { return data; },
                                    success: function (data) {
                                        response($.map(data.d, function (item) {
                                            return {
                                                value: item
                                            }
                                        }))
                                    },
                                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                                        alert(textStatus);
                                    }
                                });
                            },
                            minLength: 2//minLength as 2, it means when ever user enter 2 character in TextBox the AutoComplete method will fire and get its source data. 
                        });
                    });
                </script>
                <script type="text/javascript" id="TipList">
                    $(function () {
                        $("#txtTip").autocomplete({
                            source: function (request, response) {
                                var param = { prefixText: $('#txtTip').val() };
                                $.ajax({
                                    url: "Default.aspx/GetTip",
                                    data: JSON.stringify(param),
                                    dataType: "json",
                                    type: "POST",
                                    contentType: "application/json; charset=utf-8",
                                    dataFilter: function (data) { return data; },
                                    success: function (data) {
                                        response($.map(data.d, function (item) {
                                            return {
                                                value: item
                                            }
                                        }))
                                    },
                                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                                        alert(textStatus);
                                    }
                                });
                            },
                            minLength: 2//minLength as 2, it means when ever user enter 2 character in TextBox the AutoComplete method will fire and get its source data. 
                        });
                    });
                </script>
                <script type="text/javascript">
                    function openModalForm() {
                        window.showModalDialog('Details.aspx', '', 'status:1; resizable:1; dialogWidth:900px; dialogHeight:500px; dialogTop=50px; dialogLeft:100px')
                    }
                </script>
<script type="text/javascript">
                function saveData() {
                    //==== Call validateData() Method to perform validation. This method will return 0
                    //==== if validation pass else returns number of validations fails.

                    //var errCount = validateData();

                    //==== If validation pass save the data.


                        var txtButce = $("#txtButce").val();
                        var txtTip = $("#txtTip").val();
                        $.ajax({
                            type: "POST",
                            url: "Default.aspx/saveData",
                            data: JSON.stringify({butce:txtButce,tip:txtTip}),
                            contentType: "application/json; charset=utf-8",
                            datatype: "jsondata",
                            async: "true",
                            success: function (response) {
                                $(".errMsg ul").remove();
                                var myObject = eval('(' + response.d + ')');
                                if (myObject > 0) {

                                    $(".errMsg").append("<ul><li>Data kaydedildi</li></ul>");
                                }
                                else {
                                    $(".errMsg").append("<ul><li>Kayıt işleminde hata olustu, tekrar deneyiniz.</li></ul>");
                                }
                                $(".errMsg").show("slow");
                                clear();
                            },
                            error: function (response) {
                                alert(response.status + ' ' + response.statusText);
                            }
                        });

                }
            </script>
                <div class="ui-widget">
                    <label for="txtButce" >Bütçe Kodu/Lokasyon: </label>
                    <input id="txtButce">
                    <br />
                    <label for="txtTip">Tip/Alttip: </label>
                    <input id="txtTip" />
                </div>
                <asp:Label ID="lblDateInfo" runat="server" Style="color: White;" /><br />
                <asp:Button ID="btnCalShow" runat="server" Text="Tarih Seçiniz" />
               <asp:Button ID="btnShow" runat="server" Text="Show Modal Popup" />

            </div>
            <br />
            <asp:Button ID="btnPenaltyCalculate" Text="Hesapla" runat="server" Style="margin-left: 0px; margin-top: 5px; margin-bottom: 5px;" />
            <asp:Button ID="btnPenaltySubmit" Text="Kaydet" runat="server" Style="margin-left: 5px; margin-top: 5px; margin-bottom: 5px;" />
            <%-- %>  <asp:Button ID="btnRefresh" runat="server" Text="Haftayı yeniden yükle" style="margin-left:60px;margin-top:5px;margin-bottom:5px;" />
            --%>
        </div>
    </asp:Content>

1 个答案:

答案 0 :(得分:0)

您需要对WebMethod(或asp.net回发)执行另一个AJAX POST,以将数据发送回服务器,然后服务器可以更新您的数据库。