عندما تكتب اسم صديق او اي كلمة في تكست بوكس وتظهر بشكل جذاب مثل الفايس يوكjQuery plugin tags like input in your forms
تاج مثل الفايس بوك وتويتر Asp.net jQuery TagBox
عندما تكتب اسم صديق او اي كلمة في تكست بوكس وتظهر بشكل جذاب مثل الفايس يوك
jQuery tags like input in your forms
اولا ديمو المقال علي الموقع الرسمي
https://www.geektantra.com/projects/jquery-tagbox/
يمكنك تحميل المثال من موقعنا علي الرابط التالي
https://www.vodlara.com/upload/projects/TagBox.zip
خطوات عملQuery tags
1-وضع سكربت الجاكويري في رأس الصفحة او الهيدر head
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js"></script>
<script type="text/javascript" src="https://jquery-tagbox.googlecode.com/hg/js/jquery.tagbox.js"></script>
<script type="text/javascript">
jQuery(function() {
jQuery("#jquery-tagbox-text").tagBox();
jQuery("#jquery-tagbox-select").tagBox({
enableDropdown: true,
dropdownSource: function() {
return jQuery("#jquery-tagbox-select-options");
}
});
});
</script>
<link rel="stylesheet" href="https://jquery-tagbox.googlecode.com/hg/css/jquery.tagbox.css" />
2-كتابة جسم الصفحة او الموضوع في الصفحة في وسم الفورم او البودي form or body
<div class="row">
<label for="jquery-tagbox-text">Text TagBox (Comma Separated)</label>
<input id="jquery-tagbox-text" type="text" />
</div><!--div.row-->
<div class="row">
<label for="jquery-tagbox-select">Dropdown TagBox</label>
<select id="jquery-tagbox-select-options">
<option value="jQuery">jQuery</option>
<option value="MooTools">MooTools</option>
<option value="ProtoType">ProtoType</option>
<option value="Scriptaculous">Scriptaculous</option>
<option value="Dojo">Dojo</option> </select><!--select#-->
<input id="jquery-tagbox-select" type="text" /> </div><!--div.row-->
النتيجة كالاتي