Обрабатываете кнопку поиска с помощью браузера iPhone? - PullRequest
24 голосов
/ 22 декабря 2011

Я занимаюсь разработкой веб-приложения в asp (mobile).

При использовании браузера iPhone для ввода некоторого поискового текста в текстовое поле поиска (<mobile:TextBox ID="txtSearchData" Runat="server" BreakAfter=False></mobile:TextBox>), iPhone запускает клавиатуру поиска, и когда я нажимаю кнопку поиска с помощью клавиатуры iPhoneон обновляет всю страницу, но нажимая кнопку поиска под текстовым полем, он работает нормально.

Может кто-нибудь сказать мне, как это исправить?

Вот мой код:

<body>
  <mobile:Form ID="frmSearch" Runat="server" Font-Name="NotSet" Font-Size="Small">
    <mobile:DeviceSpecific ID="dsSearch" Runat="server">
      <Choice Filter="isHTML32">
        <ScriptTemplate>
          <link href="StyleSheets/Common.css" rel="stylesheet" type="text/css"></link>
          <meta http-equiv="content-type" content="text/html; charset=utf-8" />
          <meta id="Meta1" name="viewport" content="width=device-width; initial-scale=1.0;" />
        </ScriptTemplate>
        <HeaderTemplate>
          <table cellspacing="2" width="100%">
            <tr>
              <td width="100%">
                <uc1:Header ID="ucHeader" runat="server" />
              </td>
            </tr>
          </table>
          <table>
            <tr>
              <td colspan="2"></td>
            </tr>
            <tr>
              <td align="right">
                Find :
              </td>
              <td>
                <mobile:DeviceSpecific>
                  <Choice="isHTML32">
                    <ContentTemplate>
                      <asp:DropDownList ID="lstGroups" runat="server"  OnSelectedIndexChanged="LstGroups_SelectedIndexChanged" AutoPostBack="true">
                      </asp:DropDownList>
                    </ContentTemplate>
                  </Choice>
                </mobile:DeviceSpecific>
              </td>
            </tr>
            <tr>
              <td align="right"> Search by:</td>
              <td>
                <mobile:SelectionList ID="lstSearchPreferences" Runat="server" BreakAfter=False>
                  <Item Selected=True Text="select" />
                </mobile:SelectionList>
              </td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>
                <mobile:SelectionList ID="lstSearchOptions" Runat="server" BreakAfter=False>
                </mobile:SelectionList> 
              </td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>
                <mobile:TextBox ID="txtSearchData" Runat="server" BreakAfter=False>
                </mobile:TextBox>
              </td>
            </tr>
            <tr id="trContractorFilter" runat="server" visible="False">
              <td align="right"> 
                <mobile:Label id="lblContractorFilter" BreakAfter=False Runat="server" Visible="True" >
                  Results:
                </mobile:Label>
              </td>
              <td>
                <mobile:SelectionList ID="lstContractorFilter" Runat="server" BreakAfter="True" Visible ="True" >
                  <Item Selected="True" Text="Active Permits" />
                  <Item Text="All Permits" />
                </mobile:SelectionList>
                (your permits only)
              </td>
            </tr>
            <tr>
              <td colspan="2"></td>
            </tr>
            <tr>
              <td colspan="2"></td>
            </tr>
            <tr>
              <td colspan="2"></td>
            </tr>
            <tr>
              <td colspan="2" align="center">
                &nbsp;&nbsp;&nbsp;
                <mobile:DeviceSpecific>
                  <Choice="isHTML32">
                    <ContentTemplate>
                      <asp:Button ID="btnSearch" runat="server" Text="Search" UseSubmitBehavior=true OnClick="BtnSearch_Click"/>
                    </ContentTemplate>
                  </Choice>
                </mobile:DeviceSpecific>
              </td>
            </tr>
            <tr>
              <td colspan="2" align="center">
                <mobile:Label ID="lblError" Runat="server" Font-Bold="True" ForeColor=Red Visible="false" BreakAfter=False></mobile:Label>
              </td>
            </tr>
          </table>
        </HeaderTemplate>
      </Choice>
    </mobile:DeviceSpecific>
  </mobile:Form>
</body>

Ответы [ 4 ]

1 голос
/ 31 декабря 2013

В сочетании с этим вопросом и его ответом с помощью jQuery вы можете написать этот же код на своей странице и выполнить обработку клиента перед отправкой отправки.

Кроме того, вы можете использовать библиотечные функции $.ajax() для асинхронной отправки формы (в рамках обсуждаемого выше блока кода и вообще без запуска form.submit()), что исключит любое обновление страницы (независимо от того, откудасобытие отправки формы запускается.)

<form id="hello-world" action="sayhello">
<input type="submit" value="Hello!">
</form>

Вы можете прикрепить обработчик события следующим образом:

$('#hello-world').submit(function(ev) {
    ev.preventDefault(); // to stop the form from submitting
    /* Validations go here */
    //this.submit(); // If all the validations succeeded
    $.ajax({
         url:'your_form_target',
         data:formData,
         success:function(data,textStatus, jqXHR){

         }
     });
});
0 голосов
/ 22 октября 2013

По умолчанию элементы управления ASP.NET выполняют полную обратную передачу страницы для отправки данных страницы на сервер.

Для обработки AJAX-запроса на asp.net следует использовать элементы управления ScriptManager и UpdatePanel или использовать механизм на стороне клиента.как jQuery AJAX.

0 голосов
/ 07 декабря 2013

Причина в том, что кнопка поиска фактически не запускает отправку формы, она запускает функцию JS: onClick="BtnSearch_Click"

BtnSearch_Click, вероятно, предотвращает действие по умолчанию (отправка формы и перезагрузка страницы)от того, что произошло, и это то, что вам нужно сделать, с действием отправки формы по умолчанию.

Я не знаком с ASP, поэтому я, вероятно, не в курсе, но вы должны иметь возможность поставить

onSubmit="Btn_Click"

на форме, которую сработает кнопка «поиск» на iOS.

0 голосов
/ 11 июля 2012

Установите атрибут Action для mobile:Form в #. Это должно отменить действие обратной отправки формы по умолчанию, которое выполняется при нажатии кнопки «Поиск» на клавиатуре.

Ref

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...