Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Set Dropdownlist Selected Value (Text) based on Text / Value

Jun 4, 2015
Introduction

Here I will explain how to use
jQuery to set dropdownlist selected value or text based on value / text or jQuery set dropdownlist value based on value or text with example. By using jQuery map functions we can set dropdownlist selected value based on value or text.


To set dropdownlist selected value based on text we need to write the code like as shown below


// Set Dropdownlist Selected Value by Text
$('#btnText').click(function () {
var selectedText = 'Rohini';
$('#ddlusers option').map(function () {
if ($(this).text() == selectedText) return this;
}).attr('selected', 'selected');
})

To set dropdownlist selected value based on value we need to write the code like as shown below


// Set Dropdownlist Selected Value by Value
$('#btnValue').click(function () {
var selectedValue = '3';
$('#ddlusers option').map(function () {
if ($(this).val() == selectedValue) return this;
}).attr('selected', 'selected');
})

If you want to check it in complete example open your aspx page and write following code


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<title>set dropdownlist selected value in asp.net</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function () {
// Set Dropdownlist Selected Value by Text
$('#btnText').click(function () {
var selectedText = 'Rohini';
$('#ddlusers option').map(function () {
if ($(this).text() == selectedText) return this;
}).attr('selected', 'selected');
})
// Set Dropdownlist Selected Value by Value
$('#btnValue').click(function () {
var selectedValue = '3';
$('#ddlusers option').map(function () {
if ($(this).val() == selectedValue) return this;
}).attr('selected', 'selected');
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<select id ="ddlusers">
<option value ="1">Suresh</option>
<option value ="2">Rohini</option>
<option value ="3">Madhav</option>
<option value ="4">Mahendra</option>
<option value ="5">Honey</option>
</select>
</div>
<input type="button" value="Set By Text" id="btnText" />
<input type="button" value="Set By Value" id="btnValue" />
</form>
</body>
</html>

Live Demo

For live demo please click on below buttons to change dropdownlist selected value 



Select Name:

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

3 comments :

son bölüm burada said...

Thanks admin.

Telugu Upakarini said...

Thank you for sharing...

ahmet said...

Thank you Sir. it works like a charm

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.