Как вызвать функцию javascript с помощью Lift после нажатия кнопки?

Вот мой HTML код:Как вызвать функцию javascript с помощью Lift после нажатия кнопки?

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 

    function drawChart() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string','Year'); 
     data.addColumn('number','D1'); 
     data.addColumn('number','D2'); 
     data.addRows(2); 
     data.setValue(0,0,'1900'); 
     data.setValue(1,0,'1910'); 
     data.setValue(0,1,1); 
     data.setValue(1,1,2); 
     data.setValue(0,2,3); 
     data.setValue(1,2,1); 
     var options = {title: 'Tree Chart', 
        hAxis: {title: 'Time', titleTextStyle: {color: 'red'}}, 
        pointSize: 5}; 
     var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
    } 

    function showChart(){ 
    google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 
    } 

</script> 
<form class="form-inline lift:form.ajax"> 
<div class="lift:DChart.render"> 
<button id="getChart" value="Get Chart" class="btn btn-inverse">Get Chart</button> 
</div> 
</form> 
<div id="chart_div"></div>

функция showChart() отображает график в chart_div

Вот мой Lift код:

object DChart { 
     def render = { 
      def process():JsCmd = Run("showChart();") 
      "#getChart" #> SHtml.button("Get Chart", process) 
     } 
    }

При нажатии на кнопку должна выполнять функцию showChart() .. к сожалению он не работает.

Пожалуйста, помогите мне понять, как t o запустите функцию скрипта из лифта!

источник

2013-05-24 Luther Blissett

Что делать, если вы замените 'showChart()' 'с предупреждения (1)'? Что это показывает в этом случае? – VasyaNovikov

@ Vasya: даже с помощью метода alert() ничего не отображается. –

@jcern: thx для ваших друзей, однако он еще не работает (все 3 примера) .. Да, вы правы, я делаю что-то более сложное, но я застрял в этой проблеме, и я не получаю как решить ошибку. Я довольно новичок в разработке интерфейса (3 недели), так что это может показаться глупой проблемой для большинства из вас. Выбор Liftweb навязывается проектом, поэтому я должен разработать решение. В любом случае это странно, когда я вызываю showChart() в HTML «raw», диаграмма красиво рассылается, поэтому метод действительно работает, но когда я пытаюсь запустить скрипт из-под ниша, ничего не работает. –

SHtml.button принимает в качестве аргумента () => Any, поэтому любой JavaScript не будет возвращен в браузер и выполнен.

Я хотел бы сделать один из двух вещей:

Использование SHtml.ajaxButton вместо поскольку тело метода ожидает JsCmd возврата
Bind событие вместо этого, как: "#getChart [onclick]" #> SHtml.onEvent((str) => process())

Как сделать, по существу, то же самое и должен заставить ваш код работать. Вариант 1 заменит всю вашу кнопку HTML одним лифтом, вариант 2 просто добавит ajax к событию onclick на существующей кнопке HTML.

Я предполагаю, что вы будете делать что-то более сложное, и на самом деле хочу сделать вызов AJAX - но если вы просто хотите добавить showChart() вызова на клиентской стороне, вы можете просто сказать: "#getChart [onclick]" #> process().toJsCmd

источник

2013-05-24 18:38:43 jcern

вы правы thx, но для решения проблемы просто используйте drawChart() вместо showChart() –

Я понял из чего была проблема. Я вызывал метод showChart(), но этот метод использует функцию google setOnLoadCallback(), поэтому диаграмма может отображаться только в том случае, если метод называется загрузкой страницы (из того, что я понял до сих пор).

Решение: просто вызовите метод drawChart()! Я пробовал каждое решение, отправленное с jcern с помощью метода drawChart(), все работают.

ТНХ jcern :)

источник

2013-05-27 14:04:01

Как вызвать функцию javascript с помощью Lift после нажатия кнопки?

ответ

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