[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

ASP.NET ListBox control and "onchnage" client side event

Posted on 2009-04-20
11
Medium Priority
?
600 Views
Last Modified: 2013-11-08
I have a ListBox control.

All i am doing is adding a javascript "onchange" event  in the Attributes Tag .

When Javascript Funbction is called. Based on user Input in javascript: Confirm() i decide whether to allow user to select the Item clicked or stay on current selection.

I am able to stop The SelectedIndex_Changed event  being called based on user input in Confirm()

But the problem is on Client side Still item which i have clicked is selected  irrespective of wheather i return false or true from the onchange handler.

Same thing happens if i use onclick event alse.


Please help
0
Comment
Question by:verinder
  • 7
  • 3
10 Comments
 
LVL 39

Expert Comment

by:abel
ID: 24186634
how do you declare the event? and how does your js function look like? The handler might be declared like:

<select .... onchange="myHandler();">
in which case you should change it to:

<select .... onchange="return myHandler();">
0
 
LVL 39

Expert Comment

by:abel
ID: 24186801
I spoke too soon. Here's a working solution. It only allows you to select val2 and val4. The dropdown box will reset to the last selected value if you do not select val2 or val4.

-- Abel --

// the script
 var previousSelection = 0;
 function cancelChange(sel)
 {
 	var selValue = sel.options[sel.selectedIndex].value;
 	if(selValue == 'val2' || selValue == 'val4')
		previousSelection = sel.selectedIndex;
	else
		sel.selectedIndex = previousSelection;
		
 }
 
<select onchange="cancelChange(this);" >
	<option value="val0">select option 2 or 4</option>    
	<option value="val1">hello there 1</option>
	<option value="val2">hello there 2</option>
	<option value="val3">hello there 3</option>
	<option value="val4">hello there 4</option>    
	<option value="val5">hello there 5</option>    
	<option value="val6">hello there 6</option>    
</select>

Open in new window

0
 

Author Comment

by:verinder
ID: 24187007
actually I had <select .... onchange="return myHandler();">

the solution which you gave store the previous selection for Items4 and 2.. I need a General solution so that i can change to previous selection whenever sel is changed.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 39

Expert Comment

by:abel
ID: 24187331
> I need a General solution so that i can change to previous selection whenever sel is changed.

that's exactly what I showed you. You can replace the if-part for whatever you are after and you should be fine. If you remove the if-part, the selection is always reverted. If you don't get it working, show me what you got so far and I'll try to help you further.
0
 

Author Comment

by:verinder
ID: 24187582
If i remove the IF Part then code will be something like this :

 var previousSelection = 0;
 function cancelChange(sel)
 {
        var selValue = sel.options[sel.selectedIndex].value;
     
                sel.selectedIndex = previousSelection;
               
 }


This doesn't make sense.. How can this code will revert the selection to last selection.
0
 

Author Comment

by:verinder
ID: 24187828
here is the code i am using now :

 var PrevSelectedIndex = -1;
            function editLinksListBoxOnChange(editLinksListBoxId, SelIndexWhenViewRendered, SaveLinkBtnId, UnSavedChangesHiddentFldId, UnsavedChangeMsg, postbackScript) {
                var listBox = $get(editLinksListBoxId);
                if (PrevSelectedIndex == -1 && SelIndexWhenViewRendered >= 0) {

                    PrevSelectedIndex = SelIndexWhenViewRendered;
                }
                else if (PrevSelectedIndex == -1 && SelIndexWhenViewRendered < 0) {
                PrevSelectedIndex = 0;
                }
               
               
                var retVal = CheckUnsavedChanges(SaveLinkBtnId, UnSavedChangesHiddentFldId, UnsavedChangeMsg, postbackScript);

                if (retVal == false) {
                    var selValue = listBox.options[listBox.selectedIndex].value;
                    listBox.selectedIndex = PrevSelectedIndex;

                    // listBox.selectedIndex = selValue;



                }
                else {

                    PrevSelectedIndex = listBox.selectedIndex;
                }

                return retVal;
               
           
      }


Problem with this approch is the Initial Previous Index needs to come from ServerSide..
0
 
LVL 39

Expert Comment

by:abel
ID: 24188552
> This doesn't make sense.. How can this code will revert the selection to last selection.
the onchange is always called when someone changes the selection. if you want initially another selection, you should set the previousSelection to another value, or pass the correct value on. Just looping through the options to find out which one was selected previously will not work.

> Problem with this approch is the Initial Previous Index needs to come from ServerSide..
that's, imo, the easy way. The alternative is to create an onload handler that walks the DOM for each selectbox you have and let it register the previousSelectedIndex value as the loaded index value. If you have only one listbox, this is easier. You can also place a tiny snippet of script behind the listbox that registers the selected value, but that is the same as using onload.
0
 
LVL 39

Expert Comment

by:abel
ID: 24188564
Do i understand it correctly that you do want to show the listbox with multiple items, but that you do not want them to be changed? Ever?
0
 
LVL 39

Expert Comment

by:abel
ID: 24188594
if so, do it from serverside and create a listbox that looks like this, it will save you hours of coding ;). See the screenshot for the effect.



<select onchange="return cancelChange(this);" >
	<option value="val0" disabled="disabled">select option 2 or 4</option>    
	<option value="val1" disabled="disabled">hello there 1</option>
	<option value="val2" selected="selected">hello there 2</option>
	<option value="val3" disabled="disabled">hello there 3</option>
	<option value="val4" disabled="disabled">hello there 4</option>    
	<option value="val5" disabled="disabled">hello there 5</option>    
	<option value="val6" disabled="disabled">hello there 6</option>    
</select>

Open in new window

ScreenShot222.png
0
 
LVL 39

Accepted Solution

by:
abel earned 2000 total points
ID: 24188715
And of course, even though MS says it is supported since version 5.5, the disabled property is ignored...

But, I found something MUCH easier to use, and it works cross browser. Apparently, there's a property that says that a certain item was the default selection on page load. Forget my last three comments, poor attempts to find a solution, while there was one right under our nose. I barely use these extension properties, but if they are cross-browser, who cares?

-- Abel --



function cancelChange(sel)
{
    for(var i=0; i<sel.options.length;i++)
    {
        if(sel.options[i].defaultSelected)
        {
            sel.selectedIndex = i;
        }
    }
}

Open in new window

0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
More often than not, we developers are confronted with a need: a need to make some kind of magic happen via code. Whether it is for a client, for the boss, or for our own personal projects, the need must be satisfied. Most of the time, the Framework…
Integration Management Part 2
Is your data getting by on basic protection measures? In today’s climate of debilitating malware and ransomware—like WannaCry—that may not be enough. You need to establish more than basics, like a recovery plan that protects both data and endpoints.…
Suggested Courses

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question