Div щелчок и проблема с диалоговым окном АВТОКОМПЛЕКТА - PullRequest
Новая
       21

Div щелчок и проблема с диалоговым окном АВТОКОМПЛЕКТА

0 голосов
/ 13 апреля 2010

А что, если вы хотите автоматически заполнять пароли? Я использую похожую вещь здесь ... Я использую Div (id = loginButton), и у него есть какое-то изображение - я не хочу кнопки управления в приложении MVC (), ни кнопки изображения. У меня есть скрытый элемент управления вводом, который на самом деле является скрытой кнопкой (id = submit_btn).

Итак, при нажатии кнопки div (id = loginButton) я хочу вызвать скрытый элемент управления вводом (id = submit_btn) и выполнить его действие.

HTML: 

<div id="loginButton" > </div>

<input type="submit" style="display:none" name="submit" id="submit_btn" />

И JQuery: 

$(document).ready(function() {
 $('#loginButton').click(function() {
  $('#LoginForm').submit();
 });
 $("form[action$='HandleLoginForm']").submit(function() {
  Login();
   return false;
 });
 return false;
});

Функция Login () работает с Ajax, без диалога загрузки файлов, но мне также нужен диалог автозаполнения паролей. 

 function Login() {
  var urlData = $("#LoginForm").serialize();

    if (returnUrl != "") {
      urlData = $("#LoginForm").serialize() + "&returnUrl=" + returnUrl;
    }
  $.ajax({
  url: $("#LoginForm").attr("action"),
    type: "POST",
    data: urlData,
    dataType: "json",
    success: function(result) {
      if (result.Content != null) {
        if (result.Valid) {
          window.location = result.Content.toString();
        }
        else {
          document.body.innerHTML = result.Content.toString();
        }
      }
    }
  });
  return false;
}

Это просто, когда вы используете только 

<input type="submit">

вместо DIV. Форма знает, что она предназначена для автозаполнения паролей, но если я использую div и принудительно нажимаю скрытую кнопку, как показано в коде ниже, она не отображает диалог автозаполнения пароля. 

 $('#submit_btn').click();

Это не будет работать. Пользователь вошел в систему, но браузер не напомнил о необходимости сохранения пароля.

Мне это нужно.

Ответы [ 2 ]

0 голосов
/ 20 апреля 2010

Исправление в методе SubmitEnter - вы должны определить TYPE при управлении триггером. 

$("#loginImg").trigger("submit");

А вот и весь метод JavaScript: 

function submitenter(myfield, e) {
  var keycode;
  if (window.event) keycode = window.event.keyCode;
  else if (e) keycode = e.which;
  else return true;

  if (keycode == 13) {
    $("#loginImg").trigger("submit");
    return false;
  }
  else
    return true;
}
0 голосов
/ 15 апреля 2010

Я наконец нашел решение. Если мы хотим отправить форму с паролем AUTOCOMPLETE , мы можем использовать изображение вместо кнопки : 

<input type="image" id="loginImg" src="../Images/loginImage.png"  
    class="loginButton" />

Браузер попросит вас сохранить пароль , мы будем использовать изображение вместо кнопки и no Download File Появится диалоговое окно, если мы хотим вызвать действие в контроллере , как я сделал.

Итак, это будет окончательный HTML-код на тот случай, если кому-то понадобится:

При отправке формы (с действием по умолчанию «HandleLoginForm») вызовите javascript Метод входа: 

$(document).ready(function() {
  $("form[action$='HandleLoginForm']").submit(function() {
    Login();
    return false;
  });
  return false;
});

Метод входа в систему для входа пользователя с использованием действия контроллера MVC: 

function Login() {
  var urlData = $("#LoginForm").serialize();

  if (returnUrl != "") {
    urlData = $("#LoginForm").serialize() + "&returnUrl=" + returnUrl;
  }
  $.ajax({
    url: $("#LoginForm").attr("action"),
    type: "POST",
    data: urlData,
    dataType: "json",
    success: function(result) {
      if (result.Content != null) {
        if (result.Valid) {
          window.location = result.Content.toString();
        }
        else {
          document.body.innerHTML = result.Content.toString();
        }
      }
    }
  });
  return false;
}

Если мы хотим войти с помощью кнопки ввода, просто активируйте изображение. 

function submitenter(myfield, e) {

var keycode;
  if (window.event) keycode = window.event.keyCode;
  else if (e) keycode = e.which;
  else return true;

  if (keycode == 13) {
    $("#loginImg").trigger();
    return false;
  }
  else
    return true;
}

А вот и фрагменты HTML-кода: 

     <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
            <% Html.EnableClientValidation(); %><!-- MVC2 validation requires this -->
              <% using (Html.BeginForm("HandleLoginForm", "Login", FormMethod.Post,
                     new { id = "LoginForm" })) %>
              <% {
              %>

         <div class="divDisplayNone errorDiv"> <!-- div for errors  using MicrosoftMvcJQueryValidation.js-->
              <%=Extensions.DisplayLoginError("DivErrorsHeader", "DivErrorsContent", Model) %>
            </div>

        <div class="leftDiv">
                <label for="UserName">
                  <%=Resources.TextUsername%></label>
              </div>
              <div class="rightDiv">
                <%= Html.TextBoxFor(m => m.UserName, new { id = "txtUsername", @class = "inputField", tabIndex=1, AUTOCOMPLETE = "on", 
          onKeyPress = "return submitenter(this,event)" })%>
                <%= Html.ValidationMessageFor(m => m.UserName, "", new { @class = "redStar" })%>
              </div>

        <div class="leftDiv">
                <label for="password">
                  <%=Resources.TextPassword%></label>
              </div>
              <div class="rightDiv">
                <%= Html.PasswordFor(m => m.Password, new
        {
          id = "txtPassword", @class = "inputField", AUTOCOMPLETE = "on", tabIndex = 2,
          onKeyPress = "return submitenter(this,event)" })%>
                <%= Html.ValidationMessageFor(m => m.Password, "", new { @class = "redStar" })%>
              </div>
        <input type="image" id="loginImg" src="<%=Constants.ImageButtonNext %>"  
                class="loginButton" />


    <div class="rightDiv">
            <%= Html.CheckBoxFor(c => c.RememberMe, new { id = "chbRememberMe", tabIndex = 3,  onKeyPress = "return submitenter(this,event,'"+System.Web.HttpContext.Current.Request.Params["ReturnUrl"]+"')"  })%>
            <label class="inline" for="rememberMe">
              <%=Resources.TextRememberPassword %></label>
          </div>
<% } %>
</asp:Content>
...