Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Change text of current selected option on a DropDownCheckList element

Posted on 2014-01-21
4
Medium Priority
?
768 Views
Last Modified: 2014-03-04
Hi.

I have a web application which uses DropDownCheckList element: http://dropdown-check-list.googlecode.com/svn/trunk/doc/dropdownchecklist.html

When user mark a checkbox, a prompt message appears asking for a numer.
How can I concatenate this number just after the text beside the just marked checkbox?

This is a snippet of my code:
		$("#proves").dropdownchecklist({
			onItemClick: function(checkbox, selector){
			var justChecked = checkbox.prop("checked");
				if (justChecked){
					num_autoritz_p = prompt("Número d'autorització:","");
					if (num_autoritz_p.length>0){
						codi_nou = checkbox.val();
						a_proves[codi_nou] = num_autoritz_p;
					}
					else
						checkbox.prop("checked",false);
				}
				else {
					codi_nou = checkbox.val();
					a_proves[codi_nou] = null;
					delete(a_proves[codi_nou]);
				}
	
			} // Fi function onItemClick
		}); // Fi definició dropdownchecklist

Open in new window


Thank you.
0
Comment
Question by:gplana
2 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 2000 total points
ID: 39799162
Hi,

this should work:
$("#proves").dropdownchecklist({
			onItemClick: function(checkbox, selector){
			var justChecked = checkbox.prop("checked");
				if (justChecked){
					num_autoritz_p = prompt("Número d'autorització:","");
					if (num_autoritz_p.length>0){
						codi_nou = checkbox.val();
						a_proves[codi_nou] = num_autoritz_p;
                        oldText = $('#proves option[value="'+codi_nou+'"]').text();
                        newText =  oldText + "-" + num_autoritz_p;
                        $('#proves option[value="'+codi_nou+'"]').text(newText);
                        $('label[for="' +checkbox.prop("id") + '"]').text(newText);
					}
					else
						checkbox.prop("checked",false);
				}
				else {
					codi_nou = checkbox.val();
					a_proves[codi_nou] = null;
					delete(a_proves[codi_nou]);
				}
	
			} // Fi function onItemClick
		}); // Fi definició dropdownchecklist

Open in new window


Sample page:
http://jsfiddle.net/Rtvbx/

HTH
Rainer
0
 
LVL 15

Author Comment

by:gplana
ID: 39799331
Thank you. Yes, it works, however I have two problems:

1. Is it possible also to remove the num_autoritz_p when user un-mark the checkbox?

2. If user marks the checkbox with the most large text, then the added number goes out of the control: scrollbars appear and number appeared on the page background instead of on the control's background.

Thanks.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

CTAs encourage people to do something specific to show interest in your company, product or service. Keep reading to learn why CTAs should always be thought of as extremely important, albeit small, sections of websites.
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses
Course of the Month21 days, 1 hour left to enroll

810 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