Develop Reference

Using Telerik rad captcha with asp.net

I am new to telerik controls.
I have a aspx form with HTML controls on it. Data will be submitted using post method. I want to use Telerik Captcha on my page.
I have added following code on my aspx page :
<form id="frmYourDetails" runat="server" method="post" action="save.aspx">
Number: <input type="text" name="CustomerNumber" id="CustomerNumber" pattern="\d{2}-(?:\d{4}-){3}\d{1}" maxlength="19" title="xx-xxxx-xxxx-xxxx-x" required >
Name : <input type="text" name ="CustomerName" id ="CustomerName" required >
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadCaptcha ID="RadCaptcha1" Runat="server" ErrorMessage="The code you entered is not valid." Display="Dynamic"></telerik:RadCaptcha>
<button type="submit" id="btnSubmit">Save</button>
</form>
How do i validate if user has entered correct value in textbox that comes with RadCaptcha? I want this validation on client side if possible.

Captchas do not validate on the client, only on the sever for security reasons (if they did on the client they would be next to useless).
Call the Validate() method of the captcha or the page and check the IsValid property of the captcha.
You can see more options by using the RadCaptcha events in this demo http://demos.telerik.com/aspnet-ajax/captcha/examples/serversideevents/defaultcs.aspx

Web-Form Rendering Issue

I've got a traditional User Control, I have the following structure:
<asp:Content id="ContentBody" runat="server" ContentPlaceHolderId="MainContent">
<Core:AccountApplication id="uxAccountApplication" runat="server" />
</asp>
Inside the User Control I have a traditional:
<form id="AccountForm">
<input type="text" id="txtCompany" name="Company" />
<input type="submit" id="btnSubmit" />
</form>
The problem occurs when I call $('#AccountForm').serialize(); the request is constantly empty, nothing is serialized. If I do $('form').serialize(); it does serialize, but it also grabs all of the Web-Form ViewState rendering. Which requires some dubious approaches to correct.
Is there a better way to tackle?

Nested forms are not allowed in ASP.NET (see this question for example).
Your <form id="AccountForm"> element will be removed by ASP.NET (look at the generated HTML to confirm that).

After the answer received where it was denoted that the form element is removed, I verified and the entire form was indeed removed. So I did the following:
<div class="Application-Container">
<!-- All my form inputs -->
</div>
Wrapped them into a container, then I used jQuery to wrap the container into a form.
$('.Application-Container').wrap('<form id="AccountForm"></form>');
Now when you submit, it will rewrap into the form, then I can call $('#AccountForm').serialize() and it will correctly build my form data.

Post values in ASP .Net hiddenfield when using masterpages

In my ASP .Net Form application I need to post some data using hiddenfields.
Need to set the values dynamically in page load in the code behind file
Have to use the hidden fileds in a web form which using a masterpage.
I have to add runat="server" attribute as need to access the field in code behind file to assign value dynamically..... There the problem begins.
eg:
<input type="hidden" runat="server" id="uname" value="abc" />
converts to following by ASP .Net in run time
<input name="ctl00$content$uname" type="hidden" id="content_uname" value="abc" />
So a diffrent filed name="ctl00$content$uname" gets posted.
I tried adding ClientIDMode="Static" but still a different named field creates by ASP .Net in run time for name field as following
<asp:HiddenField ID="uname" runat="server" Value="abc" ClientIDMode="Static" />
Converts to following by asp .net
<input type="hidden" name="ctl00$content$uname" id="uname" value="abc" />
If somebody can guide me of how to post values using hiddenfields by assingning values in run time in code beghind in a masterpage environment in ASP .Net, would be really grateful. Thanks...

Any time you use runat="server" you essentially give WebForms control over that, well, "control". Which means that WebForms is going to dictate the resulting markup. Since you need granular control over the markup, you need to create it manually:
<input type="hidden" name="uname" />
Since this is just plain HTML, the WebForms rendering engine won't modify it. Then to assign a value to this from server-side code, you'd use an inline server-side statement:
<input type="hidden" name="uname" value="<%= SomePageMember %>" />
In this case, SomePageMember is a public or protected class member for the page's class. Something like this:
protected string SomePageMember { get; set; }
This will allow the UI page (which inherits from the code-behind class) to inject that value directly in the markup, while still giving you granular control over the markup itself.

You could have the value set via a server tag and not user runat="server"
<input type="hidden" runat="server" id="uname" name="uname" value="<%= HiddenValue %>" />
Create a global variable named HiddenValue and set the value when the page loads.
Edit: Just realized that this the same advice as #Bartdude.

Can HTML controls <input type="radio" /> or <input type="checkbox" /> be used as lists for a database source?

I'm a C#/VB developer trying to migrate away from aspx and web forms towards HTML.
I'm trying to do this:
HTML
<input type="radio" id="rb" runat="server" />
C#
DataTable dt = clsMyClass.GetItemTable();
rb.DataSource = dt;
rb.DataValueField = "ItemID";
rb.DataTextField = "ItemName";
rb.DataBind();
Thanks.

Ok, you can use the controls provided by the Microsoft ASP.NET Web Forms to control what and how the User interacts with the Application that you're providing him with.
Actaully what those controls provide you is that you Validate the data on the server side as well as client side. The keyword, runat="server" is used to tell the server that this Element should be handled on the Server.
If you want to redesign your application you can do that too. Instead of doing anything, just simply use your own Controls.
<input type="text" onchange="function()" />
In the JavaScript you can handle the events on that element.
function () {
/* some validations */
}
runat="server" is just to ensure that whenever the control's value is changed or any other particular functions are triggered the server would execute some method to take control of that.
Similarly, if you're not using Web Forms. You can create your own custom Controls and your own custom events to handle all the methods and events.
For example, if you have this control
<input type="text" name="myName" />
jQuery would be handy in this
$('input[name=myName]').change(function () {
alert('Hi, ' + $(this).value);
}
This way, once a user changes the value, he would get an alert for Hi, [name_of_user]. If I were to write Afzaal Ahmad Zeeshan, it would pop up
Hi, Afzaal Ahmad Zeeshan.
Now let's give the whole form control. Sample form is
<form method="post">
<input type="text" name="myName" />
<input type="text" name="id" />
<input type="submit" value="Submit" />
</form>
jQuery would be
$('form').submit(function () {
/* send data to server */
}
On the server side, handle those fields and then save them.

What are you trying to achieve? Are you trying to bind these elements with contents from your database or simply trying to add some text...
You can make a function in your codebehind to catch the data from your database and simply write it to your input controls by using response.write methods...
UPDATE
Hey!!! how about a function in codebehind like ....
public string getTheValueFromDataBase()
{
string abc = "";
abc = "text from database over here...";
return abc;
}
IN HTML PAGE
<input type="radio" /><%Response.Write(getTheValueFromDataBase()); %>

ASP.Net: ClientID not correct in code-behind of a user control

The following code does not work. The markup is in a User Control and I suppose that's why ClientID returns the wrong prefix for the TextBox id.
Markup:
<INPUT id="txtName" runat="server" maxlength="50" style="WIDTH:100px">
<INPUT type="button" value="Find Your Doctor" id="btnFind" runat="server"
style="MARGIN-LEFT:10px;WIDTH:130px">
Code-Behind:
btnFind.Attributes.Add("onClick",string.Format("DoctorLink
('{0}',document.getElementById('{1}').value,{2});",
row["ZipCode"],
txtName.ClientID));
Results in browser:
<input name="DoctorsMainArea1$ctl01$txtName" type="text"
id="DoctorsMainArea1_ctl01_txtName" maxlength="50" style="WIDTH:100px" />
<input name="DoctorsMainArea1$ctl01$btnFind" type="button"
id="DoctorsMainArea1_ctl01_btnFind" value="Find Your Doctor" style="MARGIN-
LEFT:10px;WIDTH:130px" onClick="PrepareDoctorLink('90210',
document.getElementById('DoctorsMainArea1_ctl00_txtName').value);" />
As you can see, the parameter for the JavaScript call is DoctorsMainArea1_ctl00_txtName, but the actual id of the input element is DoctorsMainArea1_ctl01_txtName.
Any idea how to fix this? jQuery? I am not so much interested in an explanation of what's going on (maybe there is another control on this page that is interfering), but a more robust way to solve the problem.

I don't know which asp.net version you are using but in 4.0 you can declare inside any server control ClientIDMode="static" and it will give you the exact id in browser.
Example:
<asp:Textbox id="txtName" runat="server" ClientIdMode="static"/>
Others are predictable, inherit and it can be used with ClientIdRowsuffix.Can be used at page level and even on master pages and even in web.config file.
Example on web.config file:
<system.web>
<Pages clientIDMode="predictable"/>
other system web properties
</system.web>
Watched Craig shoemaker's Video at tekpub, you can also read more about it at Rick's bloglink text. It's pretty cool tho.

You should try moving the code that adds the onclick attribute to the button in the PreRender event (or OnPreRender override) in your page or user-control. That should probably get the ClientID right.

A fast solution:
btnFind.Attributes.Add("onClick",string.Format("DoctorLink
('{0}',document.getElementById('{1}').value,{2});",
row["ZipCode"],
"DoctorsMainArea1_ctl01_" + txtName.ClientID));
This happens because you have a content placeholder in your page somewhere.

another solution:
html tag:
<input type="text" name="txtName" id="txtName" />
code-bind:
string txtName_value = Request.Forms["txtName"];
and you can get the value
just use the html control.