kartik-v / bootstrap-star-rating

A simple yet powerful JQuery star rating plugin with fractional rating support.

Home Page:http://plugins.krajee.com/star-rating

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Allow select instead of input as fallback

dereuromark opened this issue · comments

In my case the application uses a dropdown select with 1, 2, 3, 4, 5 to choose from as fallback.
In case the JS cannot be loaded or has an error, you can at least select from that dropdown list and post.

However, this script seems to only work with input.
I hacked it in with

		$('#star-wrapper').on('rating:change', function(event, value, caption) {
			$('#star-element').val(value);
		}).hide();

But maybe it could auto-find the type of form input and in case of select handle it natively.
Of course those values must then always match 1:1, in case you are not having step 1, but step 0.5, it would need to have all those in between too. but that is responsibility of the select then, not this script :)

Just handling it without the need of a custom callback would be nice.

commented

Maybe a html5 input type number should be used instead of the text input field.
Then if there is an JS error or the JS is not loaded you would still have the rating with min, max and steps options.

Btw this is also mentioned in the features list with some "problem" in chrome.

You can use the HTML 5 number input for polyfill and the plugin will automatically use the number attributes like min, max, and step. However, number inputs have a problem with decimal values on the Chrome Browser. Read the Browser Support section below.
http://plugins.krajee.com/star-rating#features

As well some lines below:

Browser Support
If you are using the HTML5 NUMBER input to initialize the rating, please read this. The number field does not accept decimals in Google Chrome. The input is allowed, but when the user submits the form, they get an error message and are instructed to enter a valid number (whole numbers only). Other browsers like Firefox allow decimals on the number fields. Till this is standardized across browsers, the workaround for this is to use a normal text input, and initialize the rating via javascript.

Depending on your needs this could work or not if you have decimal numbers to select.

Fine by me :)

Yes the input type=number is a good fallback option when JS is disabled, and will default the min, max, step attributes from the input into the plugin. The only thing as mentioned in the user guide (and referred by Bhoft earlier) - read about the number input issue when you have decimals or fractional rating values - which is not supported consistently across browsers.

A select dropdown input is not in the scope of the plugin currently -but you could easily extend if you are keen to have it with the plugin events / methods as you have done.

I am just saying that I use a select, as it has to be pre-defined choices here :)
Any input would usually allow for more, especially if you deactivate the browsers min/max or use an older version.

So allowing the script to work with such an element would be great. I hacked it for now, though.
See http://sandbox.dereuromark.de/sandbox/ratings