using javascript to change .net web form properties
Hello everyone, I'm fairly new to ASP.NET and I'm trying to find the best solution to this problem I'm having. I believe ultimately what I need to be able to do is change the ImageUrl value via javascript of an ImageButton. A small example of what I'm working on can be found here in a javascript form:
http://www.msu.edu/~sebenic3/
This is a simple data input method for a survey. There are three distinct columns, when you select a number within a column it will change the .gif image to show it's selected and then populate the textbox with that value. If you change the value of the textbox manually it will change the .gif according to your selection. This is the javascript version. If you look at the source you will see the images (numbers) as this:
<a href=# onClick="s1a_1_fqy_One_BC()";><img name="s1a_1_fqy_One" border="0" src="images/one.gif"></a>
the onClick calls a javascript function that changes the image src. The text input boxes look like this:
<input type="text" onChange="s1a_1_fqy_TC()"; name="s1a_1_fqy">
the onChange will check which value is in the field and then "select" the corresponding .gif image.
This javascript solution works great except for the fact that I need to resort to standard html web forms and sacrifice the .net web forms.
Initially I had written a non-javascript version using ImageButtons and and asp textboxes, the problem was, each time something was selected the page would have to postback to update it. This is extremely annoying and hard to work with considering there are several rows on this survey. Even when I set the smart navigation directive to true it was difficult to work with. This is most likely do to the fact that the code behind file was like 180k.
I think ultimately what I need is to be able to change the ImageUrl of the ImageButton item via javascript, but I'm not sure if that's even possible, or how to go about doing it.
Any opinions or advice would be greatly appreciated! Thanks.
Matt
|
0 |
|
dbr
6/1/2005 1:37:58 PM
asp.net.client-side
24353 articles. 
1 followers.
7 Replies
946 Views
Hi Matt,
I'm a little confused. You say you need to get rid of the asp.net part completely, but you're still referring to ImageUrls and ImageButtons; which is it? Also, I noticed that you're putting semicolons *outside* your event handler assignments; this isn't necessary or standard and could confuse some browsers.
For what it's worth, I'd suggest consolidating your JS functions rather than having one for each image and textbox. You can pass parameters to the function to tell it which images to roll and whatnot. Something like this might work: assume you have txtA, txtB, and txtC, and 4 image tags for each (imgA1, imgA2, etc). You'd probably want to rename the image files (e.g. imgA1.gif, imgA1_sel.gif) to make this a bit simpler, and then for each textbox, you could assign an event handler like this:
<input name="txtA" onchange="changeAnswer(this, 'A')" />
On each image tag (or link), you could change the onclick to look more like this:
<img name="imgA1" onclick="changeAnswer(this, 'A', 1)" />
Then your function would look something like this:
function changeAnswer(theField, theCategory, theNumber) {
if(theField.name.indexOf("txt") == 0) { // This is a text field based on our naming convention
// Get an integer from the field that we can use
theNumber = parseInt(theField.value); // (since this isn't passed to us)
if(!(theNumber > 0 && theNumber < 5)) { alert("Out of range"); theField.select(); return; }
}
else { // Somebody clicked an image (you could put other cases in here as well)
document.controlForm["txt" + theCategory].value = theNumber;
}
for(var i=1;i<=4;i++) { // Arrange all the images correctly
if(i==theNumber ) {
document.controlForm["img" + theCategory + theNumber ].src = "img" + theNumber + "_sel.gif";
}
else {
document.controlForm["img" + theCategory + theNumber ].src = "img" + theNumber + "_sel.gif";
}
}
}
I haven't tested this, and I know there are more efficient ways to do some of this, but since you're just starting out, I figured this would be enough for now.
Yell if you have questions.
Cheers,
Peter
Peter Brunone
MS MVP, ASP.NET
Founder, EasyListBox.com
Do the impossible, and go home early.
|
|
0 |
|
PeterBrunone
6/1/2005 2:53:13 PM
Thanks for the response and the tips. I actually do not wish to get rid of the .net web forms. However, there are only two ways I know how to do this:
1. with strictly asp.net using .net web forms
2. using javascript and regular HTML web forms. (basically resorting to classic asp is what this would be)
What I really want though is:
3. Keeping the .net web forms and using javascript within them.
The issue with the 1st option is that the files are too large - and this is really due to my amateurish programming experience (as you saw). Each time it does a post back, it has to reload a huge file, like 180k. The 2nd option has the ideal usability since the scripting is client side, but I only know how to do it with standard HTML forms.
I know I really need to work on making my code more efficient first, and the whole concept of using javascript within dot net web forms is really fuzzy to me. For example, I'm not sure of the possibilities and limitations. One example would be, is it possible to use javascript to change the ImageUrl="" value within and ImageButton via an onClick?
Matt
|
|
0 |
|
dbr
6/1/2005 4:05:50 PM
First of all, remember that you don't *have* to use WebControls in an aspx form. You can just use regular HTML tags if you like, or add runat="server" if you need them in Viewstate and such.
Second, you can add javascript event handling code to most controls by putting into the Attributes collection, like so:
myTextBox.Attributes.Add("onchange", "changeAnswer(this, 'A')")
Don't forget to set autopostback to false where applicable. For your images, if the only function they have is client-side changes, then I'd say don't use ImageButtons at all.
Keep the questions coming...
Peter Brunone
MS MVP, ASP.NET
Founder, EasyListBox.com
Do the impossible, and go home early.
|
|
0 |
|
PeterBrunone
6/1/2005 4:35:23 PM
I've pretty much concluded that the ImageButtons and ASP TextBoxes were uncessary. However, I'm running into a problem where I'm have a aspx page like this:
<javascript>
<form runat=server id="controlForm">
-- necessary ImageButtons and TextBoxes
-- regular textboxes and images with javascript function calls
-- more necessary ImageButtons and TextBoxes
</form>
When these javascript functions get called, and they try to reference the form or an object such as this:
document.images["img" + theCategory + theNumber].src = "images/img" + theNumber + "_sel.gif";
document.controlForm["txt" + theCategory].value = theNumber;
I get document.controlForm is null or not an object. I know this is due to the aspx form versus the regular html forms, and I've tried including two which of course does not work. Any ideas?
|
|
0 |
|
dbr
6/2/2005 1:28:21 AM
When you see null or not an object that means one of two things.
The element does not exist on the page or you mispelt something.This is solved by fixing the spelling or adding the element.
OR
You are calling the function before the page has been loaded? This can be solved by using an onload handler.
Eric
Pascarello.com | Twitter epascarello | LinkedIn
|
|
0 |
|
A1ien51
6/2/2005 2:14:58 AM
View Source in the browser and see what name the form tag has. The name attribute is what you need to use document.formName.
You can also get to elements directly if you assign an ID attribute, with document.getElementById("elementID").
Cheers,
Peter Brunone
MS MVP, ASP.NET
Founder, EasyListBox.com
Do the impossible, and go home early.
|
|
0 |
|
PeterBrunone
6/2/2005 2:16:44 AM
Looks like the form in that sample page is "controlform", whereas you're calling "controlForm". Javascript is case-sensitive, so those will bite you now and then.
Peter Brunone
MS MVP, ASP.NET
Founder, EasyListBox.com
Do the impossible, and go home early.
|
|
0 |
|
PeterBrunone
6/2/2005 2:19:10 AM
Similar Artilces:
How to access the properties and methods of the ActiveX control on the client side in Web Form using javascript or vbscript
Hi All, I have looked almost every where for this, and I'll be really appreciated if someone can help me with this. I found a article in MS KB article, #317392, but it is not extactly what I wanted. How do you reference an ActiveX control's methods and properties with javascript in the ASPX? Following is what I have. Some how the following line in the btnclick() does not seems to be working. AlarmCtl.StartTimer() I have done this with just .HTML and it works just fine. Can any one help. Thanks in advance. //===========================...
How to use client-side script(javascript) in DNA using .Net Remoting
Hi all, It was known that SAO and Singleton object about .Net Remoting. When I Create an object in server side and hosting in IIS's virtual directory,I want to use javascript asynchronous invoking the remote object by HTTP channel, 80 port and SOAP formatter just like XMLHTTP invoking web service. My code as following, <script> objXmlDoc = new ActiveXObject("Msxml2.DOMDocument"); objHttp = new ActiveXObject("Msxml2.XMLHTTP"); strEnvelope = ?? objHttp.onreadystatechange = function() { ...... } szUrl = "http://ServerNa...
How to use client-side script(javascript) in .Net Remoting
Hi all, It was known that SAO and Singleton object about .Net Remoting. When I Create an object in server side and hosting in IIS's virtual directory,I want to use javascript asynchronous invoking the remote object by HTTP channel, 80 port and SOAP formatter just like XMLHTTP invoking web service. My code as following, <script> objXmlDoc = new ActiveXObject("Msxml2.DOMDocument"); objHttp = new ActiveXObject("Msxml2.XMLHTTP"); strEnvelope = ?? objHttp.onreadystatechange = function() { ...... } szUrl = &...
Sending SMS using vb.net or C#.net using vb.net or c#.net
Hi My requirement is I hav one csv file with these fields id,mobilenum,messgae,status.intiallu staus is 0. once i read the all fileds and take that mobile number.using tat mobile number i need to send sms .after sending sms i shuld change status as 1 How to send sms thru coding (please dont provide any links.if it is provide also please give working links becox i checked codeproject .i didnt get any nice link. and also provide the how to update the status field im csv file Thank ssandhya To send SMS, you need some third party SMS providers. if you consul...
change web form background property from code in vb.net
I have a web form in a vb.net project. The web form has both a design view and an HTML view. In the design view, the property box has a background property that can be set to an image file. This causes a background attribute to be added to the Body element in the HTML view. My question is, how do I modify the background property from program code? I can't find the object that has this property so I can set its value. On way to do it is to use 2 different style sheet and change the stylesheet in the pageload event depending on your condition. Look for an example in Report Starter Kit ...
In datawindow.net,access the database from client side event using javascript
In powerbuilder,for example,a datawindow has two columns:itemno,description. input an itemno,validate it.if not found from the database,return 1 to trigger itemerror event; if found,get the description of the item from the database,and fill it into the column "description". The question is how to fulfill the function in web datawindow,through web service? if so,I need an example to realize it. You will need to use AJAX or make a round trip on item change event. -- Dean Jones CEO PowerObjects http://www.powerobjects.com (612) 339-3355 Ext. 112 TeamSybase * *...
Implementing .Net Form into an APS.net web form, can this be done
I am new here, but have been searching for a while, and may not have the correct lingo to find what I am looking for. I am tasked with implementing a .exe application that was writen vb6 then converted to .net into a new website my team is developing. The idea is to put each of the 3 different forms in this .exe application of 3 different .aspx pages. I have attempted multiple things to get this into the page and even started to just rewrite it as an ASP.net web form, but even then I can't reuse any of the code since the System.Web.UI.Page doesn't inherit the sa...
Access web form content from client side HTML file using javascript
I have two browser windows open, one an html file residing on the client and one an aspx page served up by the web server. Neither window is related to the other; neither one opened the other. Is it possible for javascript on the html file which resides on the user's local computer to "read" any of the information from the other open window? Ideally, I'd like to read a hidden input field from the web page. The solution only has to work in IE 6 and 7. Thanks in advance. Man, this sounds more like a virus, like spyware... Why do you need to do such thing? What I want is to open ne...
How to call web method directly form client side javascript without using hta file
Hello nice guys, I am a newbie in this forum. I need to be able to call a web service from client side javascript code without using webservices.hta file so it may work on Netscape browsers as well as IE browsers. I don't mind having to form soap request and then post it all in javascript. An example will be very helpful. Do you have any resource I may look up to, like any published article on the net, for code examples or a work around. Thanks Dean51 Hi, I wrote a library to use AJAX to consume Web Services. You can find the article, the source code (less than 8 KB) and some...
When to use client side varidation and server side varidation in .net?
In .net or classic web application we can varidate user data either on client isde or server side. How to select which side varidate to be used? Thanks! Generally, I use both client and server validation. I make sure the input is in the correct format and reasonably valid on the client, then I verify the data on the server. The extent of validation also depends on the type of data that I need to validate.Here are a few references:Validating ASP.NET Server ControlsIntroduction to Validating User Input in Web FormsClient-Side Validation for ASP.NET Server ControlsSecurity Checklist...
.Net 2.0 Web application using Vb.net is unable to create object of another dll writen in C# .net 2.0
Hi, I habe created one ASP.net web application using Vb.net which is adding reference of dlls written in C# and .net 2.0. But whenever trying to create object of referencing dll, it is throwing error :Object reference does not set to an object. But, locally it is working fine,. In the server i have deployed the .aspx files and dll files in the bin. There were already an web.config in the server which is of .net 1.1. But checked it is retrieving value for that web.config correctly. Should i have to deply any other files and if not what can be the solution for this? Please help. Thanks, So...
using non .net DLL in .net web application
Is it possible to use a non .NET DLL in a .NET web application ?I have a vb.net web application, and I am thinking of purchasing a pascal DLL to use in it. I am not sure if its possible, or if there are any downsides? I really don't want to run anything that could cause any problems or complications.Thanks! mike123 Yes, it's perfectly possible to use non-.NET DLLs. The way to do it is called Interop. If you Google for that, you'll find plenty on it. just add reference ... compile ....and use...Please click Mark as Answer on this post if it helps y...
.NET CLIENT TO ACCESS a non. NET WEB SERVICE
I develop in .net and need to create a web client to connect to a web service built in Java. http://xchainj.com:8080/axis/services/ScsEnvirodatWaterQualityIndexServiceSoap Its pretty easy when the web service was also built in .net. You can just create a web reference with the gui and automatically can see its functions and stuff. when i put this url in the box and hit go i dont get to see its functions. maybe this shouldnt be the url of the WSDL?? I Have no idea. Im very new to all of this. If there are any examples of .net clients connecting to non .net web clients it woul...
C#.NET WEB APPLICATION
hei guys, i need help on my application, i'm using C#.NET as front-ed and SQL as back-end, aside from a datagrid, i want to display my data using textboxes and not a datagrid, i can do it using Visual Basic 6 but since i'm a newbee at C#.NET i don't know how to do it, specially the codes, can anyone help me with it? thank you in advance! If you are doing windows development, i would suggest using 'DataForm wizard' (Use Solution Explorer-->Rightclick project-->Add new Item-->New DataForm). It will guide you through steps. If you are doing web apps. Use quickstart to learn them. h...
Hi All, I have looked almost every where for this, and I'll be really appreciated if someone can help me with this. I found a article in MS KB article, #317392, but it is not extactly what I wanted. How do you reference an ActiveX control's methods and properties with javascript in the ASPX? Following is what I have. Some how the following line in the btnclick() does not seems to be working. AlarmCtl.StartTimer() I have done this with just .HTML and it works just fine. Can any one help. Thanks in advance. //===========================...
How to use client-side script(javascript) in DNA using .Net Remoting
Hi all, It was known that SAO and Singleton object about .Net Remoting. When I Create an object in server side and hosting in IIS's virtual directory,I want to use javascript asynchronous invoking the remote object by HTTP channel, 80 port and SOAP formatter just like XMLHTTP invoking web service. My code as following, <script> objXmlDoc = new ActiveXObject("Msxml2.DOMDocument"); objHttp = new ActiveXObject("Msxml2.XMLHTTP"); strEnvelope = ?? objHttp.onreadystatechange = function() { ...... } szUrl = "http://ServerNa...
How to use client-side script(javascript) in .Net Remoting
Hi all, It was known that SAO and Singleton object about .Net Remoting. When I Create an object in server side and hosting in IIS's virtual directory,I want to use javascript asynchronous invoking the remote object by HTTP channel, 80 port and SOAP formatter just like XMLHTTP invoking web service. My code as following, <script> objXmlDoc = new ActiveXObject("Msxml2.DOMDocument"); objHttp = new ActiveXObject("Msxml2.XMLHTTP"); strEnvelope = ?? objHttp.onreadystatechange = function() { ...... } szUrl = &...
Sending SMS using vb.net or C#.net using vb.net or c#.net
Hi My requirement is I hav one csv file with these fields id,mobilenum,messgae,status.intiallu staus is 0. once i read the all fileds and take that mobile number.using tat mobile number i need to send sms .after sending sms i shuld change status as 1 How to send sms thru coding (please dont provide any links.if it is provide also please give working links becox i checked codeproject .i didnt get any nice link. and also provide the how to update the status field im csv file Thank ssandhya To send SMS, you need some third party SMS providers. if you consul...
change web form background property from code in vb.net
I have a web form in a vb.net project. The web form has both a design view and an HTML view. In the design view, the property box has a background property that can be set to an image file. This causes a background attribute to be added to the Body element in the HTML view. My question is, how do I modify the background property from program code? I can't find the object that has this property so I can set its value. On way to do it is to use 2 different style sheet and change the stylesheet in the pageload event depending on your condition. Look for an example in Report Starter Kit ...
In datawindow.net,access the database from client side event using javascript
In powerbuilder,for example,a datawindow has two columns:itemno,description. input an itemno,validate it.if not found from the database,return 1 to trigger itemerror event; if found,get the description of the item from the database,and fill it into the column "description". The question is how to fulfill the function in web datawindow,through web service? if so,I need an example to realize it. You will need to use AJAX or make a round trip on item change event. -- Dean Jones CEO PowerObjects http://www.powerobjects.com (612) 339-3355 Ext. 112 TeamSybase * *...
Implementing .Net Form into an APS.net web form, can this be done
I am new here, but have been searching for a while, and may not have the correct lingo to find what I am looking for. I am tasked with implementing a .exe application that was writen vb6 then converted to .net into a new website my team is developing. The idea is to put each of the 3 different forms in this .exe application of 3 different .aspx pages. I have attempted multiple things to get this into the page and even started to just rewrite it as an ASP.net web form, but even then I can't reuse any of the code since the System.Web.UI.Page doesn't inherit the sa...
Access web form content from client side HTML file using javascript
I have two browser windows open, one an html file residing on the client and one an aspx page served up by the web server. Neither window is related to the other; neither one opened the other. Is it possible for javascript on the html file which resides on the user's local computer to "read" any of the information from the other open window? Ideally, I'd like to read a hidden input field from the web page. The solution only has to work in IE 6 and 7. Thanks in advance. Man, this sounds more like a virus, like spyware... Why do you need to do such thing? What I want is to open ne...
How to call web method directly form client side javascript without using hta file
Hello nice guys, I am a newbie in this forum. I need to be able to call a web service from client side javascript code without using webservices.hta file so it may work on Netscape browsers as well as IE browsers. I don't mind having to form soap request and then post it all in javascript. An example will be very helpful. Do you have any resource I may look up to, like any published article on the net, for code examples or a work around. Thanks Dean51 Hi, I wrote a library to use AJAX to consume Web Services. You can find the article, the source code (less than 8 KB) and some...
When to use client side varidation and server side varidation in .net?
In .net or classic web application we can varidate user data either on client isde or server side. How to select which side varidate to be used? Thanks! Generally, I use both client and server validation. I make sure the input is in the correct format and reasonably valid on the client, then I verify the data on the server. The extent of validation also depends on the type of data that I need to validate.Here are a few references:Validating ASP.NET Server ControlsIntroduction to Validating User Input in Web FormsClient-Side Validation for ASP.NET Server ControlsSecurity Checklist...
.Net 2.0 Web application using Vb.net is unable to create object of another dll writen in C# .net 2.0
Hi, I habe created one ASP.net web application using Vb.net which is adding reference of dlls written in C# and .net 2.0. But whenever trying to create object of referencing dll, it is throwing error :Object reference does not set to an object. But, locally it is working fine,. In the server i have deployed the .aspx files and dll files in the bin. There were already an web.config in the server which is of .net 1.1. But checked it is retrieving value for that web.config correctly. Should i have to deply any other files and if not what can be the solution for this? Please help. Thanks, So...
using non .net DLL in .net web application
Is it possible to use a non .NET DLL in a .NET web application ?I have a vb.net web application, and I am thinking of purchasing a pascal DLL to use in it. I am not sure if its possible, or if there are any downsides? I really don't want to run anything that could cause any problems or complications.Thanks! mike123 Yes, it's perfectly possible to use non-.NET DLLs. The way to do it is called Interop. If you Google for that, you'll find plenty on it. just add reference ... compile ....and use...Please click Mark as Answer on this post if it helps y...
.NET CLIENT TO ACCESS a non. NET WEB SERVICE
I develop in .net and need to create a web client to connect to a web service built in Java. http://xchainj.com:8080/axis/services/ScsEnvirodatWaterQualityIndexServiceSoap Its pretty easy when the web service was also built in .net. You can just create a web reference with the gui and automatically can see its functions and stuff. when i put this url in the box and hit go i dont get to see its functions. maybe this shouldnt be the url of the WSDL?? I Have no idea. Im very new to all of this. If there are any examples of .net clients connecting to non .net web clients it woul...
C#.NET WEB APPLICATION
hei guys, i need help on my application, i'm using C#.NET as front-ed and SQL as back-end, aside from a datagrid, i want to display my data using textboxes and not a datagrid, i can do it using Visual Basic 6 but since i'm a newbee at C#.NET i don't know how to do it, specially the codes, can anyone help me with it? thank you in advance! If you are doing windows development, i would suggest using 'DataForm wizard' (Use Solution Explorer-->Rightclick project-->Add new Item-->New DataForm). It will guide you through steps. If you are doing web apps. Use quickstart to learn them. h...
Web resources about - using javascript to change .net web form properties - asp.net.client-side JavaScript Kit- Your comprehensive JavaScript, DHTML, CSS, and Ajax stop
Your comprehensive JavaScript, DHTML, CSS, and Ajax stop
Your comprehensive JavaScript, DHTML, CSS, and Ajax stop
Let's Code: Test-Driven Javascript by James Shore — KickstarterJames Shore is raising funds for Let's Code: Test-Driven Javascript on Kickstarter! A screencast series focusing on rigorous, professional Javascript ...
Eloquent JavaScript: A Modern Introduction to Programming... and pragmatics. I loved the tutorial-style game-like program development. This book rekindled my earliest joys of programming. Plus, JavaScript! ...
Lightbox (JavaScript) - Wikipedia, the free encyclopediaOn a Lightbox-enabled page, a user can click an image to have it magnified in a Lightbox window, which resizes itself according to the size of ...
Open Directory - Computers: Programming: Languages: JavaScript: Tools: Obfuscators
about dmoz - help Top : Computers : Programming : Languages : JavaScript : Tools : Obfuscators Tools for obfuscation/compression JavaScript code. ...
about dmoz - help Top : Computers : Programming : Languages : JavaScript : Tools : Obfuscators Tools for obfuscation/compression JavaScript code. ...
Facebook File-Transfer App Pipe Relaunches, Now Works Via JavaScript, WebRTC... allowed Facebook users to send and receive files up to 1 gigabit in size. A new version of Pipe debuted Monday, and the app now works via JavaScript ...
Under the Hood: The JavaScript SDK - The use of polyfills - Facebook
Facebook Engineering hat eine Notiz mit dem Titel Under the Hood: The JavaScript SDK - The use of polyfills geschrieben. Du kannst den vollständigen ...
Facebook Engineering hat eine Notiz mit dem Titel Under the Hood: The JavaScript SDK - The use of polyfills geschrieben. Du kannst den vollständigen ...
JavaScript SDK - Facebook-EntwicklerOverview The JavaScript SDK provides a rich set of client-side functionality for accessing Facebook...
Senior Front-End Developer (Javascript and AJAX)
Company: Sometrics Category: Software Development Location: Los Angeles, CA How to Apply: jobs@sometrics.com Description: We are looking for ...
Company: Sometrics Category: Software Development Location: Los Angeles, CA How to Apply: jobs@sometrics.com Description: We are looking for ...
Badass JavaScript (@badass_js) on TwitterWebGLWorker is an open source library that allows using WebGL from Web Workers. Great work as always from @kripken . blog.mozilla.org/research/2014/… ...
Resources last updated: 11/27/2015 9:22:39 AM