Select list add and remove in php using jquery
Posted by Raj
Select list add and remove in php using jquery:
In this article,I will show how to select list add and remove in PHP using Jquery with simple example.
Suppose I have 2 list box . The first box is populated with Characters. I have two buttons (add, remove). When the button is press it take the select element from list1 and put it in list2.
Example:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
$(function() {
$(".middle input[type='button']").click(
function(){
var listArr = $(this).attr("name").split("_");
var list1 = listArr[0];
var list2 = listArr[1];
$("#" + list1 + " option:selected").each(function(){
$("#" + list2).append($(this).clone());
$(this).remove();
});
});
})
</script>
<table width=50%>
<tr>
<td>
<select name="items1" id="first" size="5" multiple="multiple">
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
<option value="4">D</option>
<option value="5">E</option>
</select>
</td>
<td>
<div class="middle">
<input name="first_second" value=">>" type="button">
<input name="second_first" value="<<" type="button">
</div>
</td>
<td>
<select name="items" id="second" size="5" multiple="multiple">
</select>
</td>
</tr>
</table>
</body>
</html>
In this article,I will show how to select list add and remove in PHP using Jquery with simple example.
Suppose I have 2 list box . The first box is populated with Characters. I have two buttons (add, remove). When the button is press it take the select element from list1 and put it in list2.
Example:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
$(function() {
$(".middle input[type='button']").click(
function(){
var listArr = $(this).attr("name").split("_");
var list1 = listArr[0];
var list2 = listArr[1];
$("#" + list1 + " option:selected").each(function(){
$("#" + list2).append($(this).clone());
$(this).remove();
});
});
})
</script>
<table width=50%>
<tr>
<td>
<select name="items1" id="first" size="5" multiple="multiple">
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
<option value="4">D</option>
<option value="5">E</option>
</select>
</td>
<td>
<div class="middle">
<input name="first_second" value=">>" type="button">
<input name="second_first" value="<<" type="button">
</div>
</td>
<td>
<select name="items" id="second" size="5" multiple="multiple">
</select>
</td>
</tr>
</table>
</body>
</html>
This entry was posted on October 4, 2009 at 12:14 pm, and is filed under
JQuery,
list add and remove,
list add and remove in php,
move item from list1 to list2,
PHP,
PHP interview questions and answers,
Select list add and remove
.You can leave a response, or trackback from your own site.