Asp.net C# cant see input text type using jquery -
i made login/signup dialog box using jquery c# code cant see text box input fields , need value text box fields using c# code please thank ! asp.net / c# / jquery
html :
<header role="banner"> <div id="cd-logo"><a href="#0"><img src="http://codyhouse.co/demo/login-signup-modal-window/img/cd-logo.svg" alt="logo"></a></div> <nav class="main-nav"> <ul> <!-- inser more links here --> <li><a class="cd-signin" href="#0">sign in</a></li> <li><a class="cd-signup" href="#0">sign up</a></li> </ul> </nav> </header> <div class="cd-user-modal"> <!-- entire modal form, including background --> <div class="cd-user-modal-container"> <!-- container wrapper --> <ul class="cd-switcher"> <li><a href="#0">sign in</a></li> <li><a href="#0">new account</a></li> </ul> <div id="cd-login"> <!-- log in form --> <form class="cd-form"> <p class="fieldset"> <label class="image-replace cd-email" for="signin-email">e-mail</label> <input class="full-width has-padding has-border" id="signin-email" type="email" placeholder="e-mail"> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <label class="image-replace cd-password" for="signin-password">password</label> <input class="full-width has-padding has-border" id="signin-password" type="text" placeholder="password"> <a href="#0" class="hide-password">hide</a> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <input type="checkbox" id="remember-me" checked> <label for="remember-me">remember me</label> </p> <p class="fieldset"> <input class="full-width" type="submit" value="login"> </p> </form> <p class="cd-form-bottom-message"><a href="#0">forgot password?</a></p> <!-- <a href="#0" class="cd-close-form">close</a> --> </div> <!-- cd-login --> <div id="cd-signup"> <!-- sign form --> <form class="cd-form"> <p class="fieldset"> <label class="image-replace cd-username" for="signup-username">username</label> <input class="full-width has-padding has-border" id="signup-username" type="text" placeholder="username"> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <label class="image-replace cd-email" for="signup-email">e-mail</label> <input class="full-width has-padding has-border" id="signup-email" type="email" placeholder="e-mail"> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <label class="image-replace cd-password" for="signup-password">password</label> <input class="full-width has-padding has-border" id="signup-password" type="text" placeholder="password"> <a href="#0" class="hide-password">hide</a> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <input type="checkbox" id="accept-terms"> <label for="accept-terms">i agree <a href="#0">terms</a></label> </p> <p class="fieldset"> <input class="full-width has-padding" type="submit" value="create account"> </p> </form> <!-- <a href="#0" class="cd-close-form">close</a> --> </div> <!-- cd-signup --> <div id="cd-reset-password"> <!-- reset password form --> <p class="cd-form-message">lost password? please enter email address. receive link create new password.</p> <form class="cd-form"> <p class="fieldset"> <label class="image-replace cd-email" for="reset-email">e-mail</label> <input class="full-width has-padding has-border" id="reset-email" type="email" placeholder="e-mail"> <span class="cd-error-message">error message here!</span> </p> <p class="fieldset"> <input class="full-width has-padding" type="submit" value="reset password"> </p> </form> <p class="cd-form-bottom-message"><a href="#0">back log-in</a></p> </div> <!-- cd-reset-password --> <a href="#0" class="cd-close-form">close</a> </div> <!-- cd-user-modal-container --> </div> <!-- cd-user-modal --> jquery
jquery(document).ready(function($){ var $form_modal = $('.cd-user-modal'), $form_login = $form_modal.find('#cd-login'), $form_signup = $form_modal.find('#cd-signup'), $form_forgot_password = $form_modal.find('#cd-reset-password'), $form_modal_tab = $('.cd-switcher'), $tab_login = $form_modal_tab.children('li').eq(0).children('a'), $tab_signup = $form_modal_tab.children('li').eq(1).children('a'), $forgot_password_link = $form_login.find('.cd-form-bottom-message a'), $back_to_login_link = $form_forgot_password.find('.cd-form-bottom-message a'), $main_nav = $('.main-nav'); //open modal $main_nav.on('click', function(event){ if( $(event.target).is($main_nav) ) { // on mobile open submenu $(this).children('ul').toggleclass('is-visible'); } else { // on mobile close submenu $main_nav.children('ul').removeclass('is-visible'); //show modal layer $form_modal.addclass('is-visible'); //show selected form ( $(event.target).is('.cd-signup') ) ? signup_selected() : login_selected(); } }); //close modal $('.cd-user-modal').on('click', function(event){ if( $(event.target).is($form_modal) || $(event.target).is('.cd-close-form') ) { $form_modal.removeclass('is-visible'); } }); //close modal when clicking esc keyboard button $(document).keyup(function(event){ if(event.which=='27'){ $form_modal.removeclass('is-visible'); } }); //switch tab $form_modal_tab.on('click', function(event) { event.preventdefault(); ( $(event.target).is( $tab_login ) ) ? login_selected() : signup_selected(); }); //hide or show password $('.hide-password').on('click', function(){ var $this= $(this), $password_field = $this.prev('input'); ( 'password' == $password_field.attr('type') ) ? $password_field.attr('type', 'text') : $password_field.attr('type', 'password'); ( 'hide' == $this.text() ) ? $this.text('show') : $this.text('hide'); //focus , move cursor end of input field $password_field.putcursoratend(); }); //show forgot-password form $forgot_password_link.on('click', function(event){ event.preventdefault(); forgot_password_selected(); }); //back login forgot-password form $back_to_login_link.on('click', function(event){ event.preventdefault(); login_selected(); }); function login_selected(){ $form_login.addclass('is-selected'); $form_signup.removeclass('is-selected'); $form_forgot_password.removeclass('is-selected'); $tab_login.addclass('selected'); $tab_signup.removeclass('selected'); } function signup_selected(){ $form_login.removeclass('is-selected'); $form_signup.addclass('is-selected'); $form_forgot_password.removeclass('is-selected'); $tab_login.removeclass('selected'); $tab_signup.addclass('selected'); } function forgot_password_selected(){ $form_login.removeclass('is-selected'); $form_signup.removeclass('is-selected'); $form_forgot_password.addclass('is-selected'); } //remove - it's show error messages $form_login.find('input[type="submit"]').on('click', function(event){ event.preventdefault(); $form_login.find('input[type="email"]').toggleclass('has-error').next('span').toggleclass('is-visible'); }); $form_signup.find('input[type="submit"]').on('click', function(event){ event.preventdefault(); $form_signup.find('input[type="email"]').toggleclass('has-error').next('span').toggleclass('is-visible'); }); //ie9 placeholder fallback //credits http://www.hagenburger.net/blog/html5-input-placeholder-fix-with-jquery.html if(!modernizr.input.placeholder){ $('[placeholder]').focus(function() { var input = $(this); if (input.val() == input.attr('placeholder')) { input.val(''); } }).blur(function() { var input = $(this); if (input.val() == '' || input.val() == input.attr('placeholder')) { input.val(input.attr('placeholder')); } }).blur(); $('[placeholder]').parents('form').submit(function() { $(this).find('[placeholder]').each(function() { var input = $(this); if (input.val() == input.attr('placeholder')) { input.val(''); } }) }); } }); //credits http://css-tricks.com/snippets/jquery/move-cursor-to-end-of-textarea-or-input/ jquery.fn.putcursoratend = function() { return this.each(function() { // if function exists... if (this.setselectionrange) { // ... use (doesn't work in ie) // double length because opera inconsistent whether carriage return 1 character or two. sigh. var len = $(this).val().length * 2; this.setselectionrange(len, len); } else { // ... otherwise replace contents // (doesn't work in google chrome) $(this).val($(this).val()); } }); }; jquery('#cody-info ul li').eq(1).on('click', function(){ $('#cody-info').hide(); });
only html controls name attribute posted browser . make sure fields want use in c# have name attribute specified. able access these request object in c#.
if using asp.net webforms or mvc there mechanism create form fields using server controls, or in razor syntax, include name you. seem not using still possible.
also cannot see form action set - how form post asp.net server ?
Comments
Post a Comment