Home/ Questions/Q 8336827
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T04:06:56+00:00

I’m learning Jquery Mobile. I’m trying to set up the logon page for my

  • 0

I’m learning Jquery Mobile. I’m trying to set up the logon page for my .NET MVC3 site. My controller is just the standard MVC3 account controller.

Here is my Jquery Mobile page:

<html>
<head>
    <title>Mobile Logon</title>
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.css" />

    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

<script type="text/javascript">
        $(document).bind("mobileinit", function(){
           $.extend(  $.mobile , {
            ajaxEnabled: false
          });
        });
    </script>

    <script src="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.js"></script>

</head>
<body>

<div data-role="page" data-theme="e">
    <div data-role="header">

        <a href="@Url.Action("Index", "Home")" data-icon="arrow-l" rel="external" >Back</a>
        <h1>Logon</h1>
    </div>

    <div data-role = "content">        
        @Html.ValidationSummary(true, "Login was unsuccessful.")

        @using (Html.BeginForm("Logon", "Account", FormMethod.Post, null))
        {
            <label for="Username">User Name (e-mail address)</label><input type="email" name="Username" />
            <label for="Password">Password</label><input type="password" name="Password" />
            <label><input type="checkbox" name="RememberMe" data-theme="c" />Remember Me</label>
            <button type="submit" value="Log On"></button>
        }
        <center>or</center>

        @using(Html.BeginForm("Register", "Account", FormMethod.Get, null ))
        {
            <button type="submit" value="Register for an account" data-transition="flip"></button>  
        }

    </div>
</div>

When I test the page, if I leave the “Remember Me” box unchecked, then everything works fine. However, if I check the box and click “Log On”, then the controller says that the model is invalid. As I step through the code, I notice that it also thinks that the value for “RememberMe” is false whether the box is checked or not.

Here is the view model for the logon page

public class LogOnModel
{
    [Required]
    [Display(Name = "E-mail address")]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [Display(Name = "Remember me?")]
    public bool RememberMe { get; set; }
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can use your extra mobile attributes when using the HtmlHelpers, an example is below:

    @Html.TextBoxFor(x => x.UserName, new { type = "email" })
@Html.CheckBoxFor(x => x.RememberMe, new { data_theme = "c" })

    MVC 3 converts underscores in attribute names to dashes, so your data-theme attribute remains in-tact. I have just tested this and it works perfectly for your needs.

    • 0