jquery button widget
Link for all dot net and sql server video tutorial playlists
https://www.youtube.com/user/kudvenka...
Link for slides, code samples and text version of the video
http://csharp-video-tutorials.blogspo...
Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.
/ @aarvikitchen5572
In this video we will discuss jQuery button widget
jQuery button widget enhances standard form elements like buttons, inputs and anchors to buttons.
In the HTML below we have a
1. Button
2. Submit
3. Anchor
<input type="button" value="Button Element" />
<input type="submit" value="Submit Button" />
<a href="#">Anchor Element</a>
jQuery code to enhance the above elements to buttons
$('input[type="button"], input[type="submit"], a').button();
To associate icons with the buttons, use icons option of the button widget. A button can have primary and secondary icons. By default, the primary icon is displayed on the left and the secondary is displayed on the right.
$('input[type="button"], input[type="submit"], a').button({
icons: {
primary: 'ui-icon-circle-triangle-w',
secondary: 'ui-icon-circle-triangle-e'
}
});
Please note : Icons are not supported with input elements of type button, submit or reset
jQuery UI icons
http://api.jqueryui.com/theming/icons
jQuery button widget can also enhance checkboxes to buttons
<input type="checkbox" id="Bold" /><label for="Bold">B</label>
<input type="checkbox" id="Underline" /><label for="Underline">U</label>
<input type="checkbox" id="Italic" /><label for="Italic">I</label>
jQuery code to enhance above checkboxes to buttons
$('input[type="checkbox"]').button().click(function () {
var isChecked = $(this).is(':checked') ? 'Checked' : 'Unchecked'
alert($(this).attr('id') + ' Checkbox ' + isChecked)
});
jQuery button widget can also encahnce radiobuttons to buttons
<input type="radio" id="Male" name="Gender" /><label for="Male">Male</label>
<input type="radio" id="Female" name="Gender" /><label for="Female">Female</label>
jQuery code to enhance above radiobuttons to buttons
$('input[type="radio"]').button().click(function () {
alert($(this).attr('id') + ' radio button selected')
});
buttonset() widget is useful to enhance a group of radio buttons or checkboxes to buttons
<div id="radioButtons">
<input type="radio" id="Male" name="Gender" /><label for="Male">Male</label>
<input type="radio" id="Female" name="Gender" /><label for="Female">Female</label>
</div>
jQuery code to enhance a group of radio buttons to buttons
$('#radioButtons').buttonset();
$('#radioButtons input[type="radio"]').click(function () {
alert($(this).attr('id') + ' radio button selected')
});
Auf dieser Seite können Sie das Online-Video jquery button widget mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer kudvenkat 15 Juli 2015 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 19,756 Mal angesehen und es wurde von 96 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!
