Highchart не работает с JavaScript

Я использую код Highchart, и у меня возникли проблемы с помощью моего обновления COMBOBOX, они не работают одновременно (Highchart графики и поле со списком)Highchart не работает с JavaScript

Когда я скрыть Highchart графическое мое обновление combobox работает нормально.

Вот Highchart graphic on JsFiddle

Вот my tables on SqlFiddle

Вот мой контроллер:

def index 
     @countries= Country.find(:all) 
     @cities = City.find(:all,:condition=>['country_id =?',params[:country_id] ]) 
    end 

    def update_cties 
     @cities = City.find(:all,:conditions=>['country_id = ?',params[:country_id].to_i ]) 

     respond_to do |format| 
     format.js { 
      render :update do |page| 
       page.replace_html("cities", :partial=>"cities") 
      end 
     } 
    end 
end

Вот мой частичный вид:

Cities 
<%= select_tag "city_id",options_for_select(@cities.collect {|t| [t.name,t.id]} ,params[:city_id].to_i) %>

Вот мое мнение: " index.html.erb "

<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="http://code.highcharts.com/highcharts.js"></script> 
    <script src="http://code.highcharts.com/modules/exporting.js"></script> 
    </head> 
    <body> 
    <% form_tag :controller=>"project",:action=>"index" do %> 
     Select a country: 
     <%= select_tag "country_id", "<option value=\"\">Select</option>"+options_for_select(@countries.collect {|t| [t.name,t.id]},params[:country_id].to_i),:onchange=>remote_function(:url=>{:controller=>"project",:action=>"update_cities"},:with=>"'country_id=' + $('country_id').value") %> 
     <div id="cities"> 
      <%= render :partial=>"cities" %> 
     </div> 

     <%= submit_tag "Search", :name => nil %> 
    <% end %> 

    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

    <script type="text/javascript"> 
    $(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: 'Monthly Average Rainfall' 
     }, 
     subtitle: { 
      text: 'Source: WorldClimate.com' 
     }, 
     xAxis: { 
      categories: [ 
       'Jan', 
       'Feb', 
       'Mar', 
       'Apr', 
       'May', 
       'Jun', 
       'Jul', 
       'Aug', 
       'Sep', 
       'Oct', 
       'Nov', 
       'Dec' 
      ] 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: 'Rainfall (mm)' 
      } 
     }, 
     tooltip: { 
      headerFormat: '<span style="font-size:10px">{point.key}</span><table>', 
      pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' + 
       '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>', 
      footerFormat: '</table>', 
      shared: true, 
      useHTML: true 
     }, 
     plotOptions: { 
      column: { 
       pointPadding: 0.2, 
       borderWidth: 0 
      } 
     }, 
     series: [{ 
      name: 'Tokyo', 
      data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 

     }, { 
      name: 'New York', 
      data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] 

     }, { 
      name: 'London', 
      data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] 

     }, { 
      name: 'Berlin', 
      data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] 

     }] 
    }); 
});

Пожалуйста, кто-нибудь может мне помочь с этим? Я буду очень признателен за помощь

источник

2014-01-28 Carlos Morales

Можете ли вы сделать jsFiddle, показывающий это? – wergeld

Привет @wegeld Я использую этот http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-basic/, но не работает, когда мое обновление combobox (я имею в виду, что combobox и higchart не работают одновременно). –

Хорошо, я понял, что если вы спрятали Highchart-графику, ваш combobox работает, но когда вы активируете, combobox не обновит ваши города. –

Использовать $ .noConflict(); перед тем как включить новый плагин jquery, например, ниже,

//your old plugin here 

    <script type="text/javascript"> 
    $.noConflict(); 
    </script>

источник

2014-01-28 17:12:41

Хорошо, я попробовал ваш код, теперь мой combobox работает, но кажется, что Highchart Graphic не работает. Кажется, что нужно что-то еще –

Highchart не работает с JavaScript

ответ

Смежные вопросы