Skip to content

Instantly share code, notes, and snippets.

@yurylyt
Created October 10, 2012 15:31
Show Gist options
  • Save yurylyt/3866363 to your computer and use it in GitHub Desktop.
Save yurylyt/3866363 to your computer and use it in GitHub Desktop.
Chosen on a hidden element
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>GwtQuery: Chosen plugin example</title>
<link rel="stylesheet" href="bootstrap.css"/>
<link rel="stylesheet" href="style.css"/>
<link rel="stylesheet" href="http://harvesthq.github.com/chosen/chosen/chosen.css"/>
<style type="text/css">
body {
padding-top: 25px;
padding-bottom: 50px;
}
.row {
margin-top: 15px;
}
</style>
<!--<script language="javascript" src="EditorSample.nocache.js"></script>-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script language="javascript" src="http://harvesthq.github.com/chosen/chosen/chosen.jquery.js"></script>
</head>
<body>
<div>An illustration how the plain Chosen works on the hidden select</div>
<div id="view" style="width: 100%; display:none">
<select class="chzn-select" style="width: 100px">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>
<script>
$(".chzn-select").chosen({no_results_text: "No results matched"});
</script>
</div>
<button onclick="$('#view').show()">Show</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment