Develop Reference

How to find the text value in dropdown list using Request.Form

How to find text value from requested formm?
dr["Boxno"] = Request.Form["Ddlbox_1"];
dr["Boxno"] = Request.Form["Ddlbox_" + i];

In server side you can access only name and value attribute of input element not text within it.

Assuming you are using web forms there is no need to access Request.Form to retrieve the value of the dropdowns.
If you have multiple dropdowns and you want to iterate through the dropdowns you can use FindControl to find each dropdown by it's name (e.g. FindControl("Ddlbox_" + i))
FindControl will return an object of type objectwhich you can then cast to DropDownListin order to access the selected value via ddl.SelectedValue or the text via ddl.SelectedItem.Text (ddl is the variable of your dropdown list).
Please note: if the dropdowns are created for example in a repeater control, you'll need to iterate each item of the repeater and apply the FindControl method to each row.

How do I implement cascading dropdown using golang's templates

Scenario:
I have a cascade scenario, where values in second dropdown depends upon first. I have three templates "layout", "input" and "inner".
Attempt:
I'm making ajax call on change of first dropdown in "input" template and stuck with handling the response returned. Currently I found a way to fix it by replacing html of second dropdown. But, I think this is not the better way to handle. I want something in line of rendering templates where I do not need to amend html.
please help in acheiving the task in better way or point to some wiki. Only Standard Library
Thanks,
Layout.html:
http://play.golang.org/p/LikKy6rf3-
Input.html:
http://play.golang.org/p/wM7EpPdXuM
Inner.html:
http://play.golang.org/p/xFpInKZfFT
Main.go:
http://play.golang.org/p/cxtJU-Lhi1

On the higher level you have 2 options:
Either send all the values for the dropdown lists (e.g. as a tree) and change the values on the 2nd and 3rd level when the dropdown of a higher level changes (suitable for small lists, unsuitable for large dataset)
Or the one you chose: when selection changes, you make an AJAX call (triggered from onchange) and you populate the list from the results.
Elaborating #2: populating list from the AJAX call result
You also have 2 options to do this:
Either the AJAX call returns HTML call which you can simply use to replace the inner HTML of the HTML <select> tag.
Or the AJAX call may only return the data (e.g. encoded using JSON), and a Javascript code can build the content of the list.
AJAX returning HTML
The AJAX call may return the complete HTML code needed to be replaced as the inner HTML of the <select>. To achieve this at server side, you can create/separate the HTML template responsible only to generate the HTML code of this, for example:
{{define "innerList"}}
{{range .}}
<option value="{{.Key}}">{{.Text}}</option>
{{end}}
{{end}}
You can execute only this template like this:
// tmpl is the collection of your templates
values := ... // Load/construct the values
tmpl.ExecuteTemplate(w, "innerList", values)
Here values is a slice of the following structure:
type Pair struct {
Key string
Text string
}
Building <select> content with Javascript
The AJAX call may return a JSON datastructure, an array/list of value;text pairs from which you add the <option> child tags yourself.
To add an <option> to a <select> tag:
var x = document.getElementById("mySelect");
var option = document.createElement("option");
option.value = "1234";
option.text = "Kiwi";
x.add(option);
So basically what you need to do is remove current children of the <select>, iterate over the list received as the response and add a new <option> tag constructed from each.

Passing jQuery this.id in class selector

I have two different input fields, it uses typeahead.
In first field we enter Country and in other we should select City, depending on Country.
So I'm making a javascript/jQuery function, to pass field ID, to know, which of 3 pairs of Country+City pair am I selecting.
i'm using
$('.demoTypeAhead').typeahead({
source: getCityForCountry($(this).id)
});
in function getCityForCountry, I would like to pass a field specific id, but neither $(this), or this works, since it returns whole DOM object.

A jQuery object does not have an .id property. You either want
this.id // or
$(this).prop("id") // or even
$(this).attr("id")

$(this) on this scope does not return input as an object, but whole page as an object...
Just made jsfiddle for it:
Jsfiddle http://jsfiddle.net/s1d8nmqr/3/
I would like to reload data source of typeahead for second input, when I select first one (2 level select)

How to store multiple related values in javascript?

I have a set of checkboxes in a page and each checkbox is associated with a textbox.
What I need to do is to disable the textbox if the checkbox is unchecked and put a default value inside it(each textbox has a different default value).
Right now I have written a function which accepts checkboxId, textboxId and the default value which is called onClick of the checkbox.
Is there a way to store this information(checkBoxId,textBoxId,defaultValue) statically(like a map or something) in javascript so that my function does not require any arguments and can be called onLoad of the page?

This is something I did before:
<input type="checkbox" id="sample">
<input data-requires="sample" data-default="Default">
function applyControls(){
$("input[data-requires]").each(function(){
var target = $(this);
$("#" + target.data("requires")).click(function(){
if(this.checked){
target.prop("disabled", false);
}else{
target.prop("disabled", true).val(target.data("default"));
}
});
});
}
applyControls();
Note: This code is written with jQuery. You can easily convert this to native code by substituting jQuery methods with native methods.
Demo: http://jsfiddle.net/DerekL/VnHAc/
Now this way you don't have to create any map or Object to store these relations (you don't even need ids for individual textboxes!) By using data-* attributes, you do not have to modify a "map" every single time you add connections. In fact, this is the preferred way1 of doing it in HTML5.
1 https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes

create a new drop down based on another drop down in javascript

Here is my requirement.
List item
I have a couple of dropdowns A and B
I have a javascript key-value variable created:
var keyvalue={"key1":["value1","value2"],"key2":["value2","value4"]}
I am populating the keys in dropdown A, on selecting this dropdown, i am populating the corresponding values (froom the keyvalue variable) into the drop down B
Here is the sample code i a using :
The problem is even if i select a different option in dropdown A, the corresponding old option is present in the new drop down,i.e, new values are appended, rather than creating a new drop down
Any help is appreciated,thanks in advance.

You need to remove all options before populating. Add this directly right after your var quantity statement.
while (selectvalue.options.length > 0) {
selectvalue.remove();
}
Also, as mentioned by #francisco-presencia, you should lose the onchange in the HTML and instead use an event listener within your script.

I recommend you go the separation of concerns route. That means deleting the onclick="" event, and instead doing:
$('#key').change(function(){
$('#value').remove();
// Do the rest of the logic of retrievevalue() here.
});

You should use empty() to remove the old options before appending the new.
You can see it on my sample Fiddle:
JS Fiddle Here
$('#select2').empty().append(Weapons);