Any good picker for jQuery (or javascript)?

Question

Is there a good selector for jquery (or standalone js)?

I would like to select a number where there is a maximum and minimum quantity that the user can select. In addition, it has other parameters, such as displaying an odd number or an even number or a prime number or a range of numbers in which some numbers are skipped between them.

Answer 1

Using select , you can create an array with numbers to skip and execute a for loop to write options :

 int minNumber = 0; int maxNumber = 10; int[] skipThese = { 5, 7 }; for (int i = minNumber; i <= maxNumber; i++) { if(!skipThese.Contains(i)) Response.Write(String.Concat("<option value=\"", i, "\">", i, "</option>")); } 

You can do this with a razor or any other way to output HTML.

You can also do this with jQuery, dynamically following the same idea:

 $(document).ready(function() { var minNumber = 0; var maxNumber = 10; var skipThese = [5, 7]; for (var i = minNumber; i <= maxNumber; i++) { if ($.inArray(i, skipThese) == -1) $('#selectListID').append("<option value=\"" + i + "\">" + i + "</option>"); } }); 

Edit: Or you can use the C # code above on an aspx page and load it using AJAX from the page:

Create a selection box on the page:

 <select name="numPicker" id="numPicker"> <option>Loading...</option> </select> 

In the script on this page, you can use jQuery ajax() to retrieve data and populate <select> :

 $(document).ready(function() { var numPickerSelect = $("#numPicker"); $.ajax({ url: 'url/to/page.aspx', type: 'post' success: function(data) { numPickerSelect.find('option').remove(); // Remove the options in the select field numPickerSelect.append(data); // Load the content generated by the server into the select field }, error: function() { alert('An error has ocurred!'); } }); //Or use this (not sure if will work) numPickerSelect.load("url/to/page.aspx"); }); 

Answer 2

I used this. You should be able to modify to add additional parameters, such as min and max, quite easily.

 // Make a control only accept numeric input // eg, $("#myedit").numeric() // $("#myedit").numeric({alow: ' ,.'}) // $("#myedit").numeric({decimals: 2}) (function($) { $.fn.alphanumeric = function(p) { if (p == 'destroy') { $(this).unbind('keypress'); $(this).unbind('blur'); return; } p = $.extend({ ichars: " !@ #$%^&*()+=[]\\\';,/{}|\":<>?~`.- ", nchars: "", allow: "", decimals: null }, p); return this.each ( function() { if (p.nocaps) p.nchars += "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; if (p.allcaps) p.nchars += "abcdefghijklmnopqrstuvwxyz"; s = p.allow.split(''); for (i = 0; i < s.length; i++) if (p.ichars.indexOf(s[i]) != -1) s[i] = "\\" + s[i]; p.allow = s.join('|'); var reg = new RegExp(p.allow, 'gi'); var ch = p.ichars + p.nchars; ch = ch.replace(reg, ''); var dp = p.decimals; var isInteger = function(val) { var objRegExp = /(^-?\d\d*$)/; return objRegExp.test(val); }; var isNumeric = function(val) { // If the last digit is a . then add a 0 before testing so if they type 25. it will be accepted var lastChar = val.substring(val.length - 1); if (lastChar == ".") val = val + "0"; var objRegExp = new RegExp("^\\s*-?(\\d+(\\.\\d{1," + dp + "})?|\\.\\d{1," + dp + "})\\s*$", "g"); if (dp == -1) objRegExp = new RegExp("^\\s*-?(\\d+(\\.\\d{1,25})?|\\.\\d{1,25})\\s*$", "g"); var result = objRegExp.test(val); return result; }; $(this).blur(function(e) { var text = $(this).val(); if (dp != null) { if (dp == 0) { if (!isInteger(text)) { $(this).val(''); e.preventDefault(); } } else { if (!isNumeric(text)) { $(this).val(''); e.preventDefault(); } } } else { var c = text.split('') for (i = 0; i < text.length; i++) { if (ch.indexOf(c[i]) != -1) { $(this).val(''); e.preventDefault(); }; } } }); $(this).keypress ( function(e) { switch (e.which) { //Firefox fix, for ignoring specific presses case 8: // backspace key return true; case 46: // delete key return true; }; if (dp != null) { if (e.which == 32) { e.preventDefault(); return false; } var range = getRange(this); var typed = String.fromCharCode(e.which); var text = $(this).val().substr(0, range.start) + typed + $(this).val().substr(range.start); if (dp == 0) { if (!isInteger(text)) e.preventDefault(); } else { if (!isNumeric(text)) e.preventDefault(); } return; } if (!e.charCode) k = String.fromCharCode(e.which); else k = String.fromCharCode(e.charCode); if (ch.indexOf(k) != -1) e.preventDefault(); if (e.ctrlKey && k == 'v') e.preventDefault(); } ); $(this).bind('contextmenu', function() { return false }); } ); }; $.fn.numeric = function(p) { if (p == 'destroy') { $(this).unbind('keypress'); $(this).unbind('blur'); return; } var az = "abcdefghijklmnopqrstuvwxyz"; az += az.toUpperCase(); var opts = {}; if (!isNaN(p)) { opts = $.extend({ nchars: az }, { decimals: p }); } else { opts = $.extend({ nchars: az }, p); } return this.each(function() { $(this).alphanumeric(opts); } ); }; $.fn.integer = function(p) { if (p == 'destroy') { $(this).unbind('keypress'); $(this).unbind('blur'); return; } var az = "abcdefghijklmnopqrstuvwxyz"; az += az.toUpperCase(); p = { nchars: az, allow: '-', decimals: 0 }; return this.each(function() { $(this).alphanumeric(p); } ); }; $.fn.alpha = function(p) { if (p == 'destroy') { $(this).unbind('keypress'); $(this).unbind('blur'); return; } var nm = "1234567890"; p = $.extend({ nchars: nm }, p); return this.each(function() { $(this).alphanumeric(p); } ); }; })(jQuery);