Как запустить функцию jquery onchange из html-элемента в событии highchart при нажатии?

#javascript #jquery #html #highcharts

#javascript #jquery #HTML #highcharts

Вопрос:

Контейнер Highchart

  $('#container').highcharts({
              /// code goes here

              plotOptions:{
                series: {
                    cursor: 'pointer',
                    point: {
                        events: {
                            click: function() {
                                 //
                                 if(this.series.name=="Positive") {
                                    <%if(posTitle.get(0).equals("NoValue")){
                                        //do nothing
                                    }else{
                                    %>
                                    $report.html(
                                            '<table>' 
                                            '<tr><td><b>Sentiment</b></td><td><b>News</b></td><td><b>Date</b></td><td><b>News Courtesy</b></td><td><b>User Opinion</b></td></tr>'  
                                            <%   for(int tempTitle=0;tempTitle<1;tempTitle  ){%>
                                            '<tr><td>' this.series.name '</td><td><a href=' "<%=posTitle.get(tempTitle)%>" ' target = "_blank">' "<%=posNews.get(tempTitle)%>" '</a></td><td>' "<%=posDate.get(tempTitle)%>" '</td><td>iproperty.com.sg</td><td>***<select class="check" id="op1" >***<option value="0.5" selected="selected">Positive</option><option value="1">Very Positive</option><option value="0">Neutral</option><option value="-0.5">Negative</option><option value="-1">Very Negative</option></select></td></tr>' 
                                            <%}%>
                                            '</table>');
                                    <%}%>
                                }  
  

Итак, когда я пытаюсь запустить вышеупомянутый onchange, выберите внутри $report.html () . Это не вызывает приведенную ниже функцию.
итак, функция такая:

 $(document).ready(function() {
        $('.check').on('change',function ()
        {   alert(this);
            $.ajax({
                type: "post",
                url: "mainPageForOpinion.jsp", //this is my servlet
                data: {
                    output: $(this).val()
                },
                success: function(){
                    $('#output').html("Updated");
                }
            });
        });
    });
  

Кто-нибудь может мне помочь!
Спасибо

Комментарии:

1. добавьте error свойство в свой ajax, чтобы помочь себе в отладке, и вам нужно указать на WebMethod в вашем сервлете, а не на сам сервлет

2. @david: принято, но основная проблема связана не с ajax, а с событием onchange, которое даже не запускает функцию, хотя я привязываю класс.

3. Решено. Проблема заключалась в том, что скрипт должен был находиться внутри $report.html () для запуска события как $report.html () загружается поверх события onclick.

4. Пожалуйста, создайте фрагмент вашего кода

5. Привет всем, вот скрипка: jsfiddle.net/H32qN/4

Ответ №1:

Просто вызовите $(".check").change() после $report.html(...) — чтобы убедиться, что изменение вызвано после того, как вы создали новый элемент в DOM.

Ответ №2:

Поскольку вы создаете select тег с class=check динамически, вам необходимо привязать событие изменения с помощью document object. Смотрите ниже jQuery :

 $(document).ready(function() {
        $(document).on('change','.check',function ()// bind change event using document object
        {   alert(this);
            $.ajax({
                type: "post",
                url: "mainPageForOpinion.jsp", //this is my servlet
                data: {
                    output: $(this).val()
                },
                success: function(){
                    $('#output').html("Updated");
                }
            });
        });
    });
  

Комментарии:

1. Это не работает.. Я лично считаю, что запуск onchange происходит из $report.html (..) который не распознает, что в документе есть функция, поскольку она сама находится в функции onclick точек данных на диаграмме.

Ответ №3:

Проблема заключалась в том, что скрипт должен был находиться внутри $report.html () для запуска события как $report.html () загружается поверх события onclick.

скрипка: jsfiddle.net/H32qN/4