Не работает функция по кнопке
Всем привет.:) Помогите разобраться, почему у меня не работает цикл в функции start:
function start(data) {
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
var row = '';
if(fieldsCount) {
row = '<form>';
start;
row += '<button onclick="return false; start;">Далее</button></form>';
$('#feeds').html(row);
}
}
}, "json");
return false;
});
});
Функция start, прогоняющая цикл, вызывается при щелчке по элементу input:image. Но цикл не работает. Он использует полученные с сервера данные и потом работает с ними. Но как передать в вызываемую функцию эти данные? Вроде же указал: function start(data). Мне нужно, чтобы он выполнил этот цикл, а потом при нажатии по кнопке "Далее", которая создается в функции метода $.post, прогнал этот цикл еще раз. |
Вообщем не стал я выносить функцию start отдельно, а оставил ее внутри функции(function(data){...}) метода $.post. Там же ее определяю, там же и вызываю, передавая в качестве аргумента data:
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
var row = '';
if(fieldsCount) {
row = '<form>';
function go(data) { //определяю функцию
alert("Ok!");
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
}
go(data); //вызываю функцию, передавая в параметре 'data', так как цикл использует данные с сервера
row += '<button onclick="return false; go(data);">Далее</button></form>';
$('#feeds').html(row);
}
}
}, "json");
return false;
});
});
Теперь цикл выполняется, но после того как я нажимаю кнопку "Далее", функция больше не работает. Почему так? |
если Вы пишите onclick="return false; go(data); то до go(data) дело не дойдет надо просто onclick="go(data)"
Но тут у Вас еще и go и data не определены надо их гдето запоминать |
Кажется начинаю понимать... Когда нажимаю кнопку 'Далее', происходит вызов функции go с параметром data. Но он не знает откуда взять этот параметр, так как он находится в функции метода $.post. То есть извне эту функцию вызвать нельзя, только из тела функции метода $.post. Как же тогда быть? Может данные с сервера куда-то отдельно сохранять, чтобы их можно было использовать не только в теле этой функции?:-?
|
Цитата:
|
Цитата:
|
Цитата:
|
Если выношу функцию отдельно, то не передается параметр data. Почему так?
|
Цитата:
там ошибка написано row = '<form>'; start; надо start(data) ну и гдето data запоминать и все нормально будет return false надо убрать-для чего он Вам не понял |
Цитата:
|
Цитата:
|
попробуйте так
if(fieldsCount) {
start(data);
var f1=document.createElement('form');
var b1=document.createElement('button');
b1.onclick=function(){start(this.data);return false};
b1.innerHTML='Далее';
b1.data=data;
f1.appendChild(b1);
document.body.appendChild(f1);
}
|
Написал так:
row += '<button onclick="go(data); return false;">Далее</button></form>'; Страница стала перезагружаться.:-? Пишу так: row += '<button onclick="return false; go(data);">Далее</button></form>'; Страница не перезагружается. Попробовал так:
row += '<button onclick="return false; alert('hi!')">Далее</button></form>';
Страница перезагружается и выводятся json данные с сервера:-? А если так:
row += '<button onclick="alert('hi!'); return false;">Далее</button></form>';
Происходит тоже самое. Перезагружается страница и выводятся json данные с сервера.:blink: |
Цитата:
alert неприменяйте |
Функция не работает вообще, даже по первой кнопке, которая передает данные на сервер:
function go(data) {
alert("Ok!");
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
var row = '';
if(fieldsCount) {
row = '<form>';
go(data);
row += '<button onclick="go(data); return false;">Далее</button></form>';
$('#feeds').html(row);
}
}
}, "json");
return false;
});
});
Что я не так делаю?:-? |
Цитата:
var row='';//надо добавить |
Сделал так, но все равно не работает:
function go(data) {
alert("Ok!");
var row ="";
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
$('#feeds').html(row);
}
А можно ее снова не определять, а как то передать в функцию. Она же уже определена в другой функции.:-? |
Цитата:
function go(data,row) { ну и обращаться также ------------- alert("Ok!"); не срабатывает? |
Цитата:
function go(data, row) {
alert("Ok!");
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
var row = '';
if(fieldsCount) {
row = '<form>';
go(data, row);
row += '<button onclick="go(data); return false;">Далее</button></form>';
$('#feeds').html(row);
}
}
}, "json");
return false;
});
});
|
Вообщем надо как-то сделать, чтобы функция go принимала data, а возвращала измененную row.:-? Но как?
|
Цитата:
попробуйте
function go(data, row) {
alert("Ok!");
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
}
return row;
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
var row = '';
if(fieldsCount) {
row = '<form>';
row=go(data, row);
row += '<button onclick="go(data); return false;">Далее</button></form>';
$('#feeds').html(row);
}
}
}, "json");
return false;
});
});
|
Вот вот, недавно пришла такая же мысль, сделал return row, но не сработало. Прочитал ваше сообщение, теперь работает. Я так написал:
go(data, row);, вместо: row=go(data, row); Спасибо!:) Весь день с этим мучился.) |
Цитата:
http://javascript.ru/forum/jquery/33...tml#post218837 надо переделать |
Цитата:
|
Я всего лишь
row += '<button onclick="go(this.data); return false;">Далее</button></form>';добавил и он заработал по кнопке.)) |
Цитата:
я спать ложусь-если не получится завтра сделаем |
Всем доброго дня.:) Доработал я немножко свой скрипт. Подумал, поразмышлял и пришел к выводу, что функция в методе $.post будет только принимать данные с сервера и проверять их. А вот обрабатывать их и выводить результат будет функция go. Просто на мой взгляд нет логики в таком бадминтоне. Зачем по десять раз перебрасываться параметрами? Вот модифицированный код:
function go(data) {
alert("Ok!");
var row = '';
row = '<form>';
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
row += '<button onclick="go(data); return false;">Далее</button></form>';
$('#feeds').html(row);
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
if(data) {
var fieldsCount = data.length;
if(fieldsCount) {
go(data);
}
}
}, "json");
return false;
});
});
Осталось разобраться с вызовом этой функции по кнопке. |
Вот куда сохранить данные с сервера, чтобы с ними потом можно было работать дальше?:-?
|
Цитата:
var Data; в обработчике напишите function(data){Data=data; и используйте эту Data где нужно -------------------- потом из глобальных надо будет убрать-спрятать внутри гдето |
Так имеете в виду:
row += '<button onclick="function(data){Data=data;go(data); return false;}">Далее</button></form>';
А глобальную переменную куда нужно вписать? |
Цитата:
var Data;
function go(data) {
alert("Ok!");
.....
$.post('save_data.php', {drink: drink},
function(data){Data=data;
....
|
Не работает.:(
var Data;
function go(data) {
alert("Ok!");
var row = '';
row = '<form>';
for (var i in data) {
row += '<b>' + data[i].questions + '</b><Br>';
var ss = data[i].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+i+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
break;
}
row += '<button onclick="function(data) {Data = data; go(data); return false;}">Далее</button></form>';
$('#feeds').html(row);
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
Data = data;
if(data) {
var fieldsCount = data.length;
if(fieldsCount) {
go(data);
}
}
}, "json");
return false;
});
});
|
Опишите теперь как должно работать щас попробуем закончить -Вы не написали пока ничего
То есть первый раз запускается из обработчика и вызываем go и вытаскивает из data с i=0;а потом-как нажимаем на кнопку снова запускаем go но с i=1 а дальше? |
Цитата:
Выводится первый вопрос и варианты ответов, нажимаем кнопку Далее, должен появиться следующий вопрос и другие варианты. А старый вопрос с вариантами должен удаляться. Именно удаляться, а не заменяться, так как в одном вопросе может быть 3 варианта ответов, а в другом уже например 4. |
Так попробуйте
var Data;var ii=0;
function go() {var data=Data;
alert("Ok!=+ii");
var row = '';
row = '<form>';
row += '<b>' + data[ii].questions + '</b><Br>';
var ss = data[ii].answers.split(',');
for (var i2 = 0; i2<ss.length; i2++) {
row += '<input type="radio" name="id_answer'+ii+'" value="' + i2 + '">' + ss[i2] + '<Br>';
}
row += '<button onclick="go(); return false;">Далее</button></form>';
$('#feeds').html(row);
ii++;
}
$(document).ready(function(){
$('form input:image').click(function() {
var drink = $('input[name=drink]:checked').val();
$.post('save_data.php', {drink: drink},
function(data){
Data = data;
if(data) {
var fieldsCount = data.length;
if(fieldsCount) {
go();
}
}
}, "json");
return false;
});
});
|
Отлично! Работает. Спасибо огромное.:) Сейчас поем, буду дальше с сохранение значения в скрытый элемент разбираться.
|
Цитата:
var Data;var ii=0;var Rez={};
|
Я не учел один момент. Если пользователь захочет вернуться к предыдущему вопросу. В таком случае нужно создать еще одну кнопку, "Назад". Нажимаем "Далее", делаем инкремент i++, если жмем "Назад", тогда декремент i--. Только как сделать, чтобы он делал это по нажатию кнопок.
Выбранные значения наверно лучше сохранять в массив? Потом по нажатию кнопок пробегаться по нему, чтобы при переключении вопросов показывался ранее выбранный вариант. Т.е. вставлять галочку на ранее выбранном ответе, а то пользователю придется заново выбирать ответ. Были мысли выводить вопросы с вариантами ответов поочередно. Т.е. вывести первый, нажимаем "Далее", выводится второй, а первый скрывается средствами свойства CSS:
$(document).ready(function(){
var i = 0, questions = $('form p');
questions[0].style.display = 'block';
$('#right').click(function(){
if(i === questions.length - 1) {
this.style.display='none';
document.getElementById('left').style.display='none';
questions[i].style.display='none';
$('input[type=submit]').show();
return false;
}
questions[i].style.display='none';
i++;
questions[i].style.display='block';
$('#left').show();
});
$('#left').click(function(){
if(i === 0) {
return false;
}
questions[i].style.display='none';
i--;
questions[i].style.display='block';
if(i === 0) {
this.style.display='none'
}
});
});
Какая идея на ваш взгляд более удачная и логичная? Ну и в плане эффективного распределения и потребления ресурсов, что лучше? |
Вот кстати пример реализации этой идеи. Помог один человек сделать:
http://jsfiddle.net/S2Gcb/1/ Не правильно я вам сказал, выводится не поочередно, а все сразу. Только показывается первый, а остальные пока скрыты. |
Цитата:
Я так понял что ты для тренировки программирования сам взялся делать потому что в инете много готовых решений |
| Часовой пояс GMT +3, время: 01:31. |