I am using the jQuery multiselect api to select multiple values in my application,but what i want that,when i click on a button beside that multiselect box all the selected values should be fetched.But i am not able to do that ,Here i am posting my code.
<div class="showFilter" align="right">
<div class="showDate">
<select name="region" id="regionHome">
<option value="MDC">MDC</option>
<option value="LAC">LAC</option>
<option value="BRO/WPB">BRO/WPB</option>
<option value="NOE">NOE</option>
<option value="OTHER">OTHER</option>
</select>
<input id="start-date-client" type="text">
<input id="end-date-client" type="text">
<input type="button" value="Search" onclick="searchByDate()" class="searchButton">
</div>
<script type="text/javascript">
$(document).ready( function() {
$("#regionHome").multiselect();
function searchByDate(){
var multipleValues = "";
$("#regionHome").change(function() {
multipleValues = $("#regionHome option:selected").map(function () {
return $(this).text();
}).get().join('%%%%%');
alert(multipleValues)
});
}
And This is the code from where i am taking reference
<title>jQuery MultiSelect Plugin Tests</title>
<link rel="stylesheet" type="text/css" href="../../jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="http://ift.tt/1d6AYWj" />
<script type="text/javascript" src="http://ift.tt/ShXNZA"></script>
<script type="text/javascript" src="http://ift.tt/1d6AYp1"></script>
<script type="text/javascript" src="../../src/jquery.multiselect.js"> </script>
</head>
<body>
<h1>Form Submission Test</h1>
<p>Testing to ensure the correct values are actually passed when the form is submitted.</p>
<form action="#" method="post" style="margin-top:20px">
<select id="foo" name="foo" multiple="multiple" size="5">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
</select>
<div><input type="submit" value="Submit" /></div>
</form>
<script type="text/javascript">
$("#foo").multiselect();
$("form").bind("submit", function(){
alert( $(this).serialize() );
return false;
});
</script>
</body>
Here they are using the form with the submit button and getting the value but in my application i don't have any form only the div i have to use.How i can achive this??
But my code is not working ,somebody help me to solve this.I want when i will select two values it will come in the alert
Aucun commentaire:
Enregistrer un commentaire