ASP.NET中的jQuery Ajax有时可以工作,有时则不然

时间:2014-02-05 21:51:26

标签: jquery asp.net ajax jquery-mobile

我一直试图在我的VS2010网络模拟器,桌面浏览器(IE 10)和我的Android浏览器(android 2.3.4)上可靠地工作。有时它会起作用,有时它并不适用于每个浏览器。

这是我的头脑html:

<head> 
<meta name="viewport" content="width=device-width, initial-scale=1"/> 
<link rel="stylesheet" href="themes/SPA1.css" />

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile.structure-1.2.0.min.css" /> 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head> 

以下是相关的html:

<!-- Start of page_1---------------------------------------------------------------->
<div data-role="page" id="page_1" data-theme="a">
<div data-role="header" data-theme="a">
    <h1>Mobile Stop Check</h1>
</div>


<div data-role="content" id="select" data-theme="a">

<label for="select_choice_line" class="select">Select Line:</label>
<asp:DropDownList id="select_choice_line" runat="server"  data-theme="a"  AutoPostBack="false">
        <asp:ListItem Value="0" >Select Line</asp:ListItem>
    </asp:DropDownList>


<label for="select_choice_juris" class="select">Select Jurisdiction:</label>
<asp:DropDownList id="select_choice_juris" runat="server"  data-theme="a" AutoPostBack="false"
      DataSourceID="sdsJuris" DataTextField="jurisddescription" 
      DataValueField="jurisddescription" AppendDataBoundItems=True>
        <asp:ListItem Value="0">Select Jurisdiction</asp:ListItem>
    </asp:DropDownList>

<label for="select_choice_dir" class="select">Select Direction:</label>
<select name="select_choice_dir" id="select_choice_dir" data-theme="a">
  <option Value="0">Select Direction</option>
  <option value="E">EAST</option>
  <option value="N">NORTH</option>
  <option value="S">SOUTH</option>
  <option value="W">WEST</option>
</select>

<label for="select_choice_sot" class="select">Select Street of Travel:</label>
<asp:DropDownList id="select_choice_sot" runat="server"  data-theme="a" AutoPostBack="false"
      DataSourceID="sdsSOT" DataTextField="onstreet" DataValueField="onstreet" 
      AppendDataBoundItems=True>
        <asp:ListItem Value="0">Select Street</asp:ListItem>
    </asp:DropDownList>

<label for="select_choice_cross" class="select">Select Cross Street:</label>
<select name="select_choice_cross" id="select_choice_cross" data-theme="a">
  <option Value="0">Select Cross Street</option>
  <option>La Cienega</option>
  <option>Wilshire</option>
  <option>La Brea</option>
</select>

<label for="select_choice_ss" class="select">Select Stopside:</label>
<select name="select_choice_ss" id="select_choice_ss" data-theme="a">
 <option Value="0">Select Stopside</option>
 <option value="F">FAR</option>
 <option value="I">INTERSECT</option>
 <option value="M">MIDBLOCK</option>
 <option value="N">NEAR</option>
</select>

<p><a href="#home_page" data-role="button">Back to Home Page</a></p>    
</div><!-- End of p1 content -->

<div data-role="footer" data-theme="a">
    <h4>Page 1</h4>
</div><!-- /footer -->

</div><!--end of page_1---------------------------------------------------------->

这是我的ajax片段:

<script type="text/javascript">
  function getValues() {

    var str = "13:15499^";
    str = str + "01:" + $("#select_choice_line").val() + "^";
    str = str + "08:" + $("#select_choice_juris").val() + "^";
    str = str + "02:" + $("#select_choice_dir").val() + "^";
    str = str + "04:" + $("#select_choice_sot").val() + "^";

    str = str + "05:" + $("#select_choice_cross").val() + "^";
    str = str + "07:" + $("#select_choice_ss").val() + "^";

    //be sure to take last caret off or add on ifcopying this line
    str = str + "05:" + $("#select_choice_auth").val();

    addNewRecord(str);

}

</script>

<script type="text/javascript">
    function addNewRecord(strnewrecord) {

        var send = "{'strnewrecord':'" + strnewrecord + "'}";

        $.ajax({
            type: "POST",
            url: "Default.aspx/AddNewRecord_WM",
            data: send,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                $("#data").append(msg.d);
                $("#txt_log").append(msg.d);
            }
        });
    }
</script>

这是我背后的代码:

<WebMethod()> _
Public Shared Function AddNewRecord_WM(strnewrecord As String) As String
    Dim dt As String = Now.ToString
    Dim html As String

    If strnewrecord = Nothing Or strnewrecord = "" Then
        html = "<p>Transmission DateTime: " & dt & "</p>"
        html = html & "<p>Data String: None</p>"
        html = html & "<p>Return Msg: No data selected</p>"
        html = html & "<p>--------------------------------</p>"
    Else
        Dim arrFromClient As Array = strnewrecord.Split("^")
        'Dim arrToDB As Array '= ExpandClientData(arrFromClient)

        'Dim msg As String '= AddNewRecord(arrToDB)
        Dim msg As String = AddNewRecord(arrFromClient)



        html = "<p>Transmission DateTime: " & dt & "</p>"
        html = html & "<p>Data String: " & strnewrecord & "</p>"
        html = html & "<p>Return Msg: " & msg & "</p>"
        html = html & "<p>--------------------------------</p>"

    End If

    Return html

End Function

如果它到达后面的代码,它将可靠地进行数据插入。

当我无法让ajax可靠地工作时,我只是为了将数据发送到数据库而使用回发方法,但是我无法在手机浏览器上可靠地点击该按钮。现在我又回到了异步。

首先,我的ajax代码是否正确?一旦数据字符串到达​​我的webmethod,代码隐藏就可以正常工作。

第二,jQuery是否存在导致点击问题的问题?关键事件会更好吗?

感谢您寻求解决方案的任何方向。

0 个答案:

没有答案