CODEWITHSUNDEEP
javascriptjqueryasp.nettwitter-bootstrap-3
bgs
bgs

Reputation: 3223

Bootstrap Star Rating with dynamic datasource in asp .net

I have using bootstarp star rating and download the plugin in follwing URL,

https://github.com/kartik-v/bootstrap-star-rating

It is working fine.. But I want to modify the data source dynamically.

 $('#input-1').rating({
                    step: 1,
                    size: 'xs',
                    starCaptions: { 1: 'Poor', 2: 'Can Improve', 3: 'Satisfying', 4: 'Great Work', 5: 'Impressed' },
                    starCaptionClasses: { 1: 'text-danger', 2: 'text-warning', 3: 'text-info', 4: 'text-primary', 5: 'text-success' }
                });

StarCaptions & StarCaptionClass needs to change dynamically..

It needs to assign from Javascript variable Or anything else..?

Anyone can help me..

Upvotes: 0

Views: 858

Answers (2)

bgs
bgs

Reputation: 3223

Following Code works fine.. There is no JSON conversion required.

VB Code : 

<% Dim Dummy As String ="{ 1: 'Poor', 2: 'Can Improve', 3: 'Satisfying', 4: 'Great Work', 5: 'Impressed' }" %>

Javascript Code :

$('#input-1').rating({
    step: 1,
        size: 'xs',
        starCaptions: <%= Dummy %>,
        starCaptionClasses: { 1: 'text-danger', 2: 'text-warning', 3: 'text-info', 4: 'text-primary', 5: 'text-success' }
});

Upvotes: 0

KAD
KAD

Reputation: 11122

The starCaptions and StarCaptionClass are JSON objects passed to the function which can be passed from a serverside language such as PHP for example, where using the function json_encode($array) you can obtain a json string from within the php variable.

At you code level for example:

<script>
  var starCaptionsVar  = JSON.parse('<?php echo $jsonString; ?>');
  var starCaptionClassesVar  = JSON.parse('<?php echo $jsonString2; ?>'); 

  // then you can pass it to the  rating
  $('#input-1').rating({
                    step: 1,
                    size: 'xs',
                    starCaptions:starCaptionsVar ,
                    starCaptionClasses: starCaptionClassesVar);
</script>

Upvotes: 1

Related Questions