Hi Sven,
there is a JS function provided by the Star Rating plugin which provides the
callback function:
$('.auto-submit-star').rating({
callback: function(value, link){
alert(value);
}
});
What I do not quite understand is that I have to load the rating-JS file via
- final ResourceReference rating = new
JavaScriptResourceReference(RecommenderPage.class, „js/jquery.rating.js“). In
the page I am using a HeaderResponseContainer.
Other Javascript libraries work when I put them directly in the wicket:head
section of the html.
Moreover, if I load the $('.auto-submit-star').rating function via
- response.render(OnDomReadyHeaderItem.forScript("load();"));
the function is not executed. I have to provide it in a
$(document).ready(function().
Isn’t this the same?
best regards, Chris
> Am 18.04.2015 um 18:49 schrieb Chris <[email protected]>:
>
> Hi Sven,
>
> I think that the solution (star-rating as ajax) might be something like that
> in Javascript:
>
> var $attrchange = $('div', '.star-rating-control');
> $attrchange.attrchange({
> trackValues: true,
> callback: function (e) {
> if ( $( this ).hasClass( "star-rating-on" ) ) {
> $('input[name=radio1]').trigger('click');
> }
> }
> });
>
> The method #AjaxFormChoiceComponentUpdatingBehavior is now called correctly.
>
> br Chris
>
>> Am 18.04.2015 um 18:38 schrieb Chris <[email protected]>:
>>
>> Hi Sven,
>>
>> here is the URL: http://meetselva.github.io/attrchange/
>> <http://meetselva.github.io/attrchange/>
>>
>> the attrchange plugin now basically works but I am still figuring out if it
>> is possible to use this to detect changes in the star rating:
>> The star rating plugin renders for each input field additional a div element
>> and if the star is shown a certain value is added to the class attribute,
>> e.g. star-rating-on.
>>
>> <div role="text" aria-label="" class="star-rating rater-0 star
>> wicket__type17d9 star-rating-applied star-rating-live"
>> id="tt1__field117e0"><a title="radio16">radio16</a></div>
>>
>> The plugin of the star rating can be found here:
>> https://www.fyneworks.com/jquery/star-rating/
>> <https://www.fyneworks.com/jquery/star-rating/>
>>
>> Chris
>>
>>
>>> Am 18.04.2015 um 18:28 schrieb Sven Meier <[email protected]>:
>>>
>>> Hi,
>>>
>>> please give us the url of the plugin you're trying to use.
>>>
>>> Sven
>>>
>>> On 18.04.2015 16:44, Chris wrote:
>>>> Hi Sven,
>>>>
>>>> there is the JS plugin to detect changes in attributes (this might help to
>>>> detect changes in the star-rating.
>>>> http://meetselva.github.io/attrchange/
>>>> <http://meetselva.github.io/attrchange/>
>>>> This works fine in a pure html-file, but in Wicket the JS function is not
>>>> called (see below). I have created a quick start project:
>>>> https://github.com/cat1000/AttrChange
>>>> <https://github.com/cat1000/AttrChange>
>>>>
>>>> Would you mind to have a look at it?
>>>>
>>>> $attrchange.attrchange({
>>>> trackValues: true,
>>>> callback: function(e) {
>>>>
>>>> }
>>>> });
>>>>
>>>> Thanks, Chris
>>>>
>>>>
>>>>> Am 18.04.2015 um 14:41 schrieb Chris <[email protected]>:
>>>>>
>>>>> Hi Sven,
>>>>>
>>>>> I tried following function but that still does only work with JQuery
>>>>> Rating JS disabled.
>>>>> With JQuery Rating, the function is not called.
>>>>>
>>>>> $('input[name=field1_type]').change(function() {
>>>>> trigger('click');
>>>>> });
>>>>>
>>>>>
>>>>> Below is the HTML code when Rating JS is enabled:
>>>>>
>>>>> <div class="rating" id="field1__type1482">
>>>>> <span class="star-rating-control"><div
>>>>> class="rating-cancel"><a title="Cancel Rating"></a></div>
>>>>> <div role="text" aria-label=""
>>>>> class="star-rating rater-0 star wicket-field1__type1482
>>>>> star-rating-applied star-rating-live star-rating-on"
>>>>> id="tt1__field11489"><a title="radio16">radio16</a></div><div role="text"
>>>>> aria-label="" class="star-rating rater-0 star wicket-field1__type1482
>>>>> star-rating-applied star-rating-live star-rating-on"
>>>>> id="tt1__field2148a"><a title="radio17">radio17</a></div><div role="text"
>>>>> aria-label="" class="star-rating rater-0 star wicket-field1__type1482
>>>>> star-rating-applied star-rating-live star-rating-on"
>>>>> id="tt1__field3148b"><a title="radio18">radio18</a></div><div role="text"
>>>>> aria-label="" class="star-rating rater-0 star wicket-field1__type1482
>>>>> star-rating-applied star-rating-live star-rating-on"
>>>>> id="tt1__field4148c"><a title="radio19">radio19</a></div><div role="text"
>>>>> aria-label="" class="star-rating rater-0 star wicket-field1__type1482
>>>>> star-rating-applied star-rating-live" id="tt1__field5148d"><a
>>>>> title="radio20">radio20</a></div></span><input name="field1_type"
>>>>> type="radio" class="star wicket-field1__type1482 star-rating-applied"
>>>>> id="tt1__field11489" value="radio16" style="display: none;">
>>>>> <input name="field1_type" type="radio" class="star
>>>>> wicket-field1__type1482 star-rating-applied" id="tt1__field2148a"
>>>>> value="radio17" style="display: none;">
>>>>> <input name="field1_type" type="radio" class="star
>>>>> wicket-field1__type1482 star-rating-applied" id="tt1__field3148b"
>>>>> value="radio18" style="display: none;">
>>>>> <input name="field1_type" type="radio" class="star
>>>>> wicket-field1__type1482 star-rating-applied" id="tt1__field4148c"
>>>>> value="radio19" style="display: none;">
>>>>> <input name="field1_type" type="radio" class="star
>>>>> wicket-field1__type1482 star-rating-applied" id="tt1__field5148d"
>>>>> value="radio20" style="display: none;">
>>>>> </div>
>>>>>
>>>>>
>>>>> br Chris
>>>>>
>>>>>
>>>>>> Am 18.04.2015 um 13:46 schrieb Sven Meier <[email protected]>:
>>>>>>
>>>>>> Hi Chris,
>>>>>>
>>>>>> does the JS trigger click() on the radio when the user selects a rating?
>>>>>> When not, check for a callback to trigger click() by yourself.
>>>>>>
>>>>>> Regards
>>>>>> Sven
>>>>>>
>>>>>>
>>>>>> On 18.04.2015 13:34, Chris wrote:
>>>>>>> Hi Sven,
>>>>>>>
>>>>>>> thanks a lot for your help!
>>>>>>> I am using the jquery star rating JS to replace the radio boxes through
>>>>>>> stars - with that it does not work. Without it I just tried it and AJAX
>>>>>>> works (thanks for your feedback!)
>>>>>>> Why might there be a problem with the jQuery JS?
>>>>>>>
>>>>>>> br, Chris
>>>>>>>
>>>>>>>
>>>>>>>> Am 18.04.2015 um 13:24 schrieb Sven Meier <[email protected]>:
>>>>>>>>
>>>>>>>> Looks good.
>>>>>>>>
>>>>>>>> I've just added an AjaxFormChoiceComponentUpdatingBehavior to
>>>>>>>> wicket-examples' RadioGroupPage and it worked as expected.
>>>>>>>>
>>>>>>>> Which Wicket version? Can you create a quickstart?
>>>>>>>>
>>>>>>>> Have fun
>>>>>>>> Sven
>>>>>>>>
>>>>>>>> On 18.04.2015 13:19, Chris wrote:
>>>>>>>>> The html is as follows:
>>>>>>>>>
>>>>>>>>> <wicket:panel>
>>>>>>>>> <form wicket:id="form" class="form">
>>>>>>>>> <div class="rating" wicket:id="group">
>>>>>>>>> <input wicket:id="radio1" type="radio"/>
>>>>>>>>> <input wicket:id="radio2" type="radio"/>
>>>>>>>>> ...
>>>>>>>>> </div>
>>>>>>>>> </form>
>>>>>>>>> </wicket:panel>
>>>>>>>>>
>>>>>>>>> best regards, Chris
>>>>>>>>>
>>>>>>>>>
>>>>>>>>>> Am 18.04.2015 um 13:14 schrieb Chris <[email protected]>:
>>>>>>>>>>
>>>>>>>>>> Hi Sven,
>>>>>>>>>>
>>>>>>>>>> the form is added to a panel.
>>>>>>>>>>
>>>>>>>>>> Chris
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>> Am 18.04.2015 um 11:26 schrieb Sven Meier <[email protected]>:
>>>>>>>>>>>
>>>>>>>>>>> Hi,
>>>>>>>>>>>
>>>>>>>>>>> is your RadioGroup is bound to <wicket:container> in your markup?
>>>>>>>>>>>
>>>>>>>>>>> Sven
>>>>>>>>>>>
>>>>>>>>>>> On 18.04.2015 07:00, Chris wrote:
>>>>>>>>>>>> Hi all,
>>>>>>>>>>>>
>>>>>>>>>>>> I have a radio group with different radio choices and I would like
>>>>>>>>>>>> to add ajax behavior to the group.
>>>>>>>>>>>> With the method #AjaxFormChoiceComponentUpdatingBehavior, the
>>>>>>>>>>>> #onUpdate is never called currently.
>>>>>>>>>>>>
>>>>>>>>>>>> How to fix this?
>>>>>>>>>>>>
>>>>>>>>>>>>
>>>>>>>>>>>>
>>>>>>>>>>>> Form form = new Form("form");
>>>>>>>>>>>> RadioGroup<RadioChoice> radioGroup = new
>>>>>>>>>>>> RadioGroup<RadioChoice>("group", new Model<RadioChoice>() {...}
>>>>>>>>>>>>
>>>>>>>>>>>> Radio<RadioChoice> radio1 = new Radio<RadioChoice>("radio1", new
>>>>>>>>>>>> Model<RadioChoice>(1));
>>>>>>>>>>>> Radio<RadioChoice> radio2 = new Radio<RadioChoice>("radio2", new
>>>>>>>>>>>> Model<RadioChoice>(2));
>>>>>>>>>>>> radioGroup.add(radio1);
>>>>>>>>>>>> radioGroupd.add(Radio2);
>>>>>>>>>>>>
>>>>>>>>>>>> form.add(radioGroup);
>>>>>>>>>>>>
>>>>>>>>>>>> radioGroup.add(new AjaxFormChoiceComponentUpdatingBehavior() {
>>>>>>>>>>>> protected void onUpdate(AjaxRequestTarget target) {
>>>>>>>>>>>> // Ajax actions here
>>>>>>>>>>>> }
>>>>>>>>>>>> });
>>>>>>>>>>>>
>>>>>>>>>>>> Thanks, Chris
>>>>>>>>>>>> ---------------------------------------------------------------------
>>>>>>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>>>>>>
>>>>>>>>>>> ---------------------------------------------------------------------
>>>>>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>>>>>
>>>>>>>>>> ---------------------------------------------------------------------
>>>>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>>>>
>>>>>>>>> ---------------------------------------------------------------------
>>>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>>>
>>>>>>>> ---------------------------------------------------------------------
>>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>>
>>>>>>> ---------------------------------------------------------------------
>>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>>> For additional commands, e-mail: [email protected]
>>>>>>>
>>>>>>
>>>>>> ---------------------------------------------------------------------
>>>>>> To unsubscribe, e-mail: [email protected]
>>>>>> For additional commands, e-mail: [email protected]
>>>>>>
>>>>
>>>
>>>
>>>
>>> ---------------------------------------------------------------------
>>> To unsubscribe, e-mail: [email protected]
>>> For additional commands, e-mail: [email protected]
>>>
>>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
