This has been bugging me for a good hour. I'm starting out with Telerik Controls, and I probably missed out a few steps, but the code below is trying to find out the selectedItem via client side scripting:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="TestRadListBox.aspx.cs" Inherits="TestRadListBox" %>
<%# Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="javascript/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function clickMe() {
var rlb = $('#<%# rlbTemp.ClientID %>');
alert('rlb = ' + rlb + '; rlb.get_selectedItem = ' + rlb.get_selectedItem);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<div>
<telerik:RadListBox runat="server" ID="rlbTemp"></telerik:RadListBox>
<input type="button" value="Click Me" onclick="clickMe();"/>
</div>
</form>
</body>
</html>
The problem I have is the function get_selectedItem is nowhere to be found. Basically, how can I have a reference to it? I tried looking if there's a reference I missed, but it seems the radscriptmanager should be sufficient, yet, when I looked at what it's exposing, there is no get_selectedItem in it.
Thanks in advance.
Try replacing your JSCode with the following :
function clickMe() {
var rlb = $find('<%= rlbTemp.ClientID %>');
alert('rlb = ' + rlb + '; rlb.get_selectedItem = ' + rlb.get_selectedItem);
}
Related
I'm trying to reset my form using javascript on client side. The code looks like this:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" >
function Reset() {
TextBox1.text = "";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="Reset()" />
</div>
</form>
</body>
</html>
This of course isn't working, I get the error that Button1 is undefinded. I tried looking control's name within browser (by viewing page source) and using that instead of its ID but that didn't work either.
you need to get the value using getElementById
var mybutton= document.getElementById('Button1');
mybutton.value = ""
I advise you to use jQuery for your javascript code. It's a standard anyway.
After you reference jQuery, you may rewrite your JavaScript as follows:
<script type="text/javascript" >
function resetForm() {
$("#<%=TextBox1.ClientID %>").val("");
}
</script>
If you still do not want to use jQuery, then you need to access your element using its client ID like following:
<script type="text/javascript" >
function resetForm() {
document.getElemenyById("<%=TextBox1.ClientID %>").value = "";
}
</script>
Also, as #Jon pointed out, you need to either rename your OnClientClick value to resetForm() or rename your JavaScript function.
i have a strange situation may its a easy fix or something i may be missing but here is the question.
i have a asp.net form with master page and my validation works great without any problem but the problems starts when i try to hook my click event to the server side,
here is what i meant:
i have a form with few fields on it and if the form is empty than it should STOP submitting, otherwise allow me to execute the server side script
but its not happening, even my form is in invalid state (i do get error message saying i have to enter the required fileds) but still executing my server side script.
i would like to execute my server side script only if the form is in valid state.
here is my code:
my master page
<%# Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>jQuery Validation in ASP.NET Master Page</title>
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script src="Scripts/jquery.validate.js" type="text/javascript"></script>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
my content page:
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script type="text/javascript">
$(document).ready(function() {
$("#aspnetForm").validate({
rules: {
<%=txtName.UniqueID %>: {
minlength: 2,
required: true
},
<%=txtEmail.UniqueID %>: {
required: true,
email:true
}
}, messages: {
<%=txtName.UniqueID %>:{
required: "* Required Field *",
minlength: "* Please enter atleast 2 characters *"
}
}
});
});
</script>
Name: <asp:TextBox ID="txtName" MaxLength="30" runat="server" /><br />
Email: <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox><br />
<asp:Button ID="btnSubmit" runat="server" onclick="SubmitTheForm();" Text="Submit" />
</asp:Content>
function SubmitTheForm() {
SaveTheForm();
}
function SaveTheForm() {
debugger;
var request = buildNewContactRequest();
ContactServiceProxy.invoke({ serviceMethod: "PostNewContact",
data: { request: request },
callback: function(response) {
processCompletedContactStore(response);
},
error: function(xhr, errorMsg, thrown) {
postErrorAndUnBlockUI(xhr, errorMsg, thrown);
}
});
return false;
}
i have tried both ways
1)
$(document).ready(function() {
$("#btnSubmit").click(function(event) {
event.preventDefault();
SaveTheForm();
});
});
2)
<asp:Button ID="btnSubmit" runat="server" onclick="SubmitTheForm();
function SubmitTheForm() {
SaveTheForm();
}
you're posting your data without checking if the form is valid or not
I think you have to use something like this
function SubmitTheForm() {
if ($("#aspnetForm").valid()) SaveTheForm();
}
Sorry, I'm giving you bad advice. Forget my previous entry. What is the SubmitTheForm() method? You're using the jQuery validation plug in, so you should just need to attach the validation stuff to the form and all should be right with the world.
I think your button onclick needs to be
return SaveTheForm();
As in:
<asp:Button ID="btnSubmit" runat="server" onclick="return SubmitTheForm();" Text="Submit" />
Do you try to put the jQuery code script in the Head ContentPlaceHolder
I have a asp.net web content from that have a asp.net textbox and I want to use Plugin/Validation but it is not working with me here is my code:
<%# Page Title="" Language="C#" MasterPageFile="~/Master.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="IMAM_APPLICATION.WebForm1" %>
<%# Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script src="js/jquery-1.4.1.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$.validator.addMethod("#<%=TextBox1.ClientID %>", function(value, element) {
return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,16}$/i.test(value);
}, "Passwords are 8-16 characters with uppercase letters, lowercase letters and at least one number.");
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</asp:Content>
Well I am unsure what the problem is as this does not tell me much "not working".
Just looking at your code I am trying to see might cause it not to work.
First you don't have the validate method hooked up to any form. I don't think you can run it without hooking it up to a form tag.
// from the validation documentation
$("#commentForm").validate();
Notice how they tie the validate field.
Next
I think your doing your .addMethod wrong
$(document).ready(function() {
$.validator.addMethod("#<%=TextBox1.ClientID %>", function(value, element) {
return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,16}$/i.test(value);
}, "Passwords are 8-16 characters with uppercase letters, lowercase letters and at least one number.");
});
You have what is above but if you look at the documentation.
addMethod( name, method, [message] )
jQuery.validator.addMethod("math", function(value, element, params) {
return this.optional(element) || value == params[0] + params[1];
}, jQuery.format("Please enter the correct value for {0} + {1}"));
see how the first paramter is "name" not "id". Name is like the name of this new method.
So this addMethod could be called "Test101" that would be the name. Or like in the examle you see they named it "math"
next you would do something like this
$("#commentForm").validate
(
rules:
{
txtBoxIdName:
{
math: true;
}
}
);
So it would me something like this. You would put the textboxId in the validate method of the form and then you call your .addMethod inside that id. In my case I used the .addMethod called "math" and I believe you just set it to "true" to make it required and to run.
I have not tested this so I will try to find some examples that actually run.
Edit
Here is what the master page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
see it does have a form id and when you hook this master page with an aspx page you should have this.
<title>
</title>
<script>try { for(var lastpass_iter=0; lastpass_iter < document.forms.length; lastpass_iter++){ var lastpass_f = document.forms[lastpass_iter]; if(typeof(lastpass_f.lpsubmitorig)=="undefined"){ if (typeof(lastpass_f.submit) == "function") { lastpass_f.lpsubmitorig = lastpass_f.submit; lastpass_f.submit = function(){ var form = this; try { if (document.documentElement && 'createEvent' in document) { var forms = document.getElementsByTagName('form'); for (var i=0 ; i<forms.length ; ++i) if (forms[i]==form) { var element = document.createElement('lpformsubmitdataelement'); element.setAttribute('formnum',i); element.setAttribute('from','submithook'); document.documentElement.appendChild(element); var evt = document.createEvent('Events'); evt.initEvent('lpformsubmit',true,false); element.dispatchEvent(evt); break; } } } catch (e) {} try { form.lpsubmitorig(); } catch (e) {} } } } }} catch (e) {}</script></head><body>
<form name="aspnetForm" method="post" action="Default2.aspx" id="aspnetForm">
<div>
<input name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1MmRkJ6rATKUz8lX/wrHNVcM8o9fwof8=" type="hidden">
</div>
<div>
</div>
</form>
</body></html>
So try that if that will be good enough for hooking it up.
I'm trying to add some share this javascript in between the head tags of an asp.net page but only if the page is not secure (!Request.IsSecureConnection). How do I get the code in the head tags to check for secure connection and then write the javascript if not secure. I've tried using <% %> blocks and RegisterStartupScriptBlock and it's not working
UPDATE:
Was able to get it to work using this in the Page_Load
if(!Request.IsSecureConnection)
{
HtmlGenericControl Include = new HtmlGenericControl("script");
Include.Attributes.Add("type", "text/javascript");
Include.Attributes.Add("src", "http....");
this.Page.Header.Controls.Add(Include);
}
This works for me:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<% if (!Request.IsSecureConnection)
{ %>
<script type="text/javascript">
onload = function() {
alert('Page is not secure') };
</script>
<% } %>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
<%if (!Request.IsSecureConnection)
{%>
<script ..........> </script>
<%}%>
This didn't work?
Update From your comments this didn't work. I'm guessing it has to do with something you are doing in your code behind. Did you try calling RegisterClientScriptBlock from your code behind? If you could post your aspx and code behind we might be able to help more.
I have a multiline textbox that by default, is set to ReadOnly. I would like a button on the page to change the control to allow it to be edited. I would like this code to run on the client side because the page renders slowly and I'd like to avoid the post back.
The problem I'm having is the javascript code that I wrote to remove the readonly attribute appears to have no effect. I posted a stripped down example that illustrates the problem for your review.
<%# Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test</title>
<script type="text/javascript" language="javascript">
function EnableEditing() {
var e = document.getElementById("<%=TextBox1.ClientID%>");
var result = e.removeAttribute("readonly");
alert(result);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div> </div>
<asp:TextBox ID="TextBox1" runat="server" ReadOnly="True" TextMode="MultiLine">test</asp:TextBox>
<input id="Button1" onclick="EnableEditing()" type="button" value="Remove RO" />
</form>
</body>
</html>
TextBox1 is the server side id,
try
var e = document.getElementById("<%=TextBox1.ClientID%>");
var result = e.removeAttribute("readonly",0);
or if you dont want the caseinsensitive search
var result = e.removeAttribute("readOnly");//note upercase Only
Use var e = document.getElementById("<%=TextBox1.ClientID%>");
Also, if you want to read the modified text on postback, you can't set the readonly attribute on the server control. You have to set it on the client only, as in: TextBox1.Attributes("readOnly") = "readOnly";