How to use angularjs in ASP.NET textbox with having runat server

Question

0.00/5 (No votes)

See more:

, +

Hy guys can anyone tell how to do form validation with angularjs in asp.net (.aspx page Not MVC)
i want to use 
runat="server"
and angularjs bouth from form validation , can any one tell is it possible or not. 

if possible how to do this?

What I have tried:

Here is my code
 
<div class="form-group col-md-6">                            
<label for="txtLanguage" data-ng-class="{ 'text-danger' : frmLanguage.LanguageName.$invalid && !frmLanguage.LanguageName.$pristine || frmLanguage.LanguageName.$error.minlength,'text-success':!frmLanguage.LanguageName.$pristine}">Language name</label>                            
<input type="text"  class="form-control" id="txtLanguage" name="LanguageName" data-ng-class="{ 'is-invalid' : frmLanguage.LanguageName.$invalid && !frmLanguage.LanguageName.$pristine,'is-valid' : !frmLanguage.LanguageName.$pristine }" data-ng-model="LanguageName" placeholder="Language" required runat="server" /> 
<p data-ng-show="frmLanguage.LanguageName.$invalid && !frmLanguage.LanguageName.$pristine && !frmLanguage.LanguageName.$error.minlength" class="invalid-feedback">class="fa fa-meh-o">Language is required!</p>                        
</div>
 
 
==========================
 
 
if i remove  runat="server"
 
from the textbox then my angularjs code is running .
 
 
i want to use 
runat="server"
and angularjs bouth from form validation , can any one tell is it possible or not. 
 
if possible how to do this?

Posted 5-Feb-19 1:21am

Anilananda

Add a Solution

Comments

F-ES Sitecore 5-Feb-19 7:25am

When you add runat=server the id of the element can be altered so I am assuming that will be your issue. You might give it a server-side id of "Textbox1" but the client-side id will be different so if you use Textbox1 as the id in your javascript then it won't be able to find your control.

Anilananda 5-Feb-19 10:47am

Actually, the textbox name is getting the change in runtime, because of that it is not coming. In the runtime, the name of the textbox name is c100$txt1languagename something like this coming.
Which means instead of LanguageName as a name the id of the textbox is coming as a name with adding c100$ in the front.

alexvw 5-Feb-19 11:41am

Hi there,

The change you are seeing in your control's id is standard behavior of ASP.NET WebForms. Its purpose is to make sure your controls have a unique id.

You can change this by setting the ClientIDMode property at either page or control level; e.g.

Page Level:

<%@ Page Title="TestPage" Language="C#" MasterPageFile="~/UserMaster.master" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="project.test" ClientIDMode="Static"%>

Control Level:
<asp:TextBox ID="txtLanguage" runat="server" ClientIDMode="Static">.

Careful with this! if you set it up a page level, it will be up to you to ensure your controls have unique ids, otherwise, no javascript will work as expected, for it will not know how tell which control you what it to work on.

Hope this helps.

Anilananda 5-Feb-19 23:34pm

You are right i made changes now it working but still one problem is there.

<asp:TextBox ID="txtLanguage" name="Language" runat="server" ClientIDMode="Static">

In this case it will not change the Id but what about name , name will change as ctl00$ContentPlaceholder1$txt1language
.
Any solution to make name also static ?

alexvw 6-Feb-19 15:18pm

Hi Anilananda,

ClientIDMode = "Static" does not reach the control's rendered name, that's why you can see the "ctl00$ContentPlaceholder1$txt1language" on the client's side.

There is a method, that I know of, to change it, but requires the creation of your own control, which must inherit the proper base class, e.g. TextBox, Lable, etc.

In your implementation, you would have to override the attributes (if I recall right) method that writes them out. In there, you would have to detect the name attribute and overwrite or replace it with the one you want.

I have never had time to get into that much of a detail.

Anyways, DO NOT attempt to replace you control's names in the response object, for such thing will invalidate all events for said controls.

Cheers!

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)