We Keep Coding

two dropdowns' selection javascript

I have two visible one hidden dropdown and filter textbox works perfectly except checking flag if option already in selected list part, idea is you filter from hidden and see in visible dropdownlist, then select from visible and that goes to selected list. this part works until I added second for loop and flags which controls if option already in selected list then skip on filter and doesn't show in visible list which doesn't work.
If I delete between "FROM" to "HERE" comments works, but also shows selecteds in visible list.
problem : frozen browser and visible list full of options like infinite.
function SearchList() {
var listHidden = document.getElementById('<%= ddlStudentHidden.ClientID %>');
var listVisible = document.getElementById('<%= ddlStudents.ClientID %>');
var listSelected = document.getElementById('<%= ddlSelecteds.ClientID %>');
var txtFind = document.getElementById('<%= txtFind.ClientID %>');
$("#<%= ddlStudents.ClientID %>").find('option').remove();
for (var i = 0; i < listHidden.options.length; i++) {
if (listHidden.options[i].text.toLowerCase().match(txtFind.value.toLowerCase())) {
/*FROM*/
var flag = false;
for (var i = 0; i < listSelected.options.length; i++) {
if (!listSelected.options[i].text.toLowerCase().match(txtFind.value.toLowerCase())) {
flag = true;
}
}
if (!flag) /*HERE*/
$("#<%= ddlStudents.ClientID %>").append($('<option></option>').val(listHidden.options[i].value).html(listHidden.options[i].text));
}
}
}

Yo declare the variable i again in the inner loop which will override the the i in the outer loop. Rename the variable in the inner loop to something else except i.

Grab Gridview textbox input value Jquery

I have built the following Gridview (Employees and their weekly target):
Desired result: I have a submit button at the bottom which will take all the data from the Gridview using jQuery and push it into my database.
At the moment, I cannot even retrieve the textbox values though, i have the following code:
$(document).ready(function () {
$("#btnSubmit").click(function () {
$("#GridView1 td").each(function () {
var value = $(this).text();
alert(value);
});
});
});
This Selects all the "Table Data" cells... It is selecting the names perfectly, but as soon as it gets to a textbox, it doesnt get the value I type in, it just alerts nothing.
I have tried the following too, each with different, but not the desired results:
.html
.val
.innerHTML
Would anyone be able to point out where I am going wrong please? please let me know if you need anymore info...

You have to check if the control exists in the table cells or not
Give this a try
var value = $(this).find('input').length > 0 ? $(this).find('input').val() : $(this).text();
Hope this will work!

You must select the input textbox in your selection as given below
$(document).ready(function () {
$("#btnSubmit").click(function () {
$("#GridView1 td input").each(function () {
var value = $(this).val();
alert(value);
});
});
});

Listbox items always getting 0 count on server side

I have two listboxs, and two buttons. The buttons will transfer 1 item from listbox1 to listbox2.
$(function () {
$("#btnLeft").bind("click", function () {
var options = $("[id*=listBoxRight] option:selected");
for (var i = 0; i < options.length; i++) {
var opt = $(options[i]).clone();
$(options[i]).remove();
$("[id*=listBoxLeft]").append(opt);
return false;
}
});
$("#btnRight").bind("click", function () {
var options = $("[id*=listBoxLeft] option:selected");
for (var i = 0; i < options.length; i++) {
var opt = $(options[i]).clone();
$(options[i]).remove();
$("[id*=listBoxRight]").append(opt);
return false;
}
});
});
This code is working and is transferring items from one another in the client side. My problem is when I get the value at the server side, I get 0 count.
Is it possible to bind the new items of listbox2 using jQuery?
EDIT
I am using a user control:
The control is ShutterUserControl , and it contains two listboxs.

Make your listbox runat server.
<select id="listboxRight" runat="server">
<option>text1</option>
<option>text2</option>
</select>
Then use following thing with Request.form. For that in your above JavaScript you need to use ClientID like <%=listBoxRight.ClientID%>.
Then you find that user control via two way one is with Request.Form
Request.Form["YourUserControlName$listboxRight"]
Another is
var listBox = YourUserControlName.FindControl("listboxRight");
Hope this will help.

try Request.Forms["controlName"] to get the new values in the dropdown list.

Telerik MVC Grid. How to change grid edit mode on client side?

I need custom grid behavior on client side: on press Add button, grid create new row in InLine mode, and on press Add2 button, grid create new row in InForm mode, with additional functionality. I add new custom command in toolbar and call javascript function Add2, where try change grid edit mode. But edit mode not changed, new row created in InLine mode. What I do wrong, and in general, is it possible?
<script type="text/javascript">
function Add2() {
var grid = $('#Property').data('tGrid');
grid.editing.mode = 'InForm';
grid.addRow();
}
</script>
Html.Telerik().Grid<Models.PropertyTypeModel>().Name("Property")
// skip
.DataBinding(dataBinding =>
{
dataBinding.Ajax()
.Select("_PropertySelect", "Options", new { oid = "<#= OptionTypeID #>" })
// skip
})
.ToolBar(commands =>
{
commands.Insert().ButtonType(GridButtonType.ImageAndText);
commands.Custom().Text("Add2").Url("javascript:void(0)").HtmlAttributes(new { onclick = "Add2()" });
})
.Editable(editing => editing
.Mode(GridEditMode.InLine)
)
)
Thanks in advance for your reply.

This is not currently supported.

dropdown with option to add new element

Is it possible to have a dropdown control with functionality that if there is no element in the dropdown im interested in I can just type it in myself ?
thanks for any help

Disclaimer: I know this question hasn't been tagged jQuery, but for future users searching i'll provide a start for a jquery solution.
Here's a relly simple start to a jQuery plugin to handle allowing dynamic options into a select box. An extra textbox and button is added to the DOM for each select element. Also an option is added to the bottom of the select list with text such as "add item...". Selected this option allows the user to type a new item in and add it to the select box.
Live example here: http://jsfiddle.net/8G6z3/1/
(function($) {
$.fn.freeEntry= function(options){
var settings = $.extend(
{},
{ //defaults
addItemText: 'add item...'
},
options
);
return this.each(function(){
var $this = $(this);
var $addItemOption = $('<option>' + settings.addItemText + '</option>');
$this.append($addItemOption);
var $addItemControl = $('<input type=text>').hide();
$addItemControl.insertAfter($this);
var $addItemButton = $('<input type=button value="add">').hide();
$addItemButton.insertAfter($addItemControl);
$addItemButton.click(function(){
if($addItemControl.val().length){
var $newOption = $('<option>' + $addItemControl.val() + '</option>');
$newOption.insertBefore('option:last',$this)
$this.val($addItemControl.val());
$addItemControl.val('');
}
$addItemControl.hide();
$addItemButton.hide();
});
$this.change(function(){
var $this = $(this);
if($this.val() == settings.addItemText){
$addItemControl.show().focus();
$addItemButton.show();
}
});
});
}
})(jQuery);
Usage: $('#mySelectBox').freeEntry( { addItemText: "Add a new item yo!"} );

This is not possible with the standard HTML select control, however you could use an HTML input textbox, which uses AJAX autocomplete to display a dropdown:
http://www.devbridge.com/projects/autocomplete/jquery/
Alternatively, you could have an "Other" option in the HTML select dropdown, which when selected, will display a TextBox control

You could have a text box near the drop down list with a submit button which appends html to the list section?