2016-03-09 2 views
0

Я пытаюсь написать простой виджет для измерения показателя Net Promoter. Это то, что у меня есть до сих пор:HTML с JavaScript, отправить кнопку

<!DOCTYPE html> 
<html> 
<body> 
<link type="text/css" rel="stylesheet" href="NPSstyle.css"/> 
    <h1>Net Promoter Score<h1> 
     <p class="question">How likely are you to recommend this tool to a friend or colleague?</p> 
<form id="myForm"> 

    <button type="button" id="button1">1</button> 
    <button type="button" id="button2">2</button> 
    <button type="button" id="button3">3</button> 
    <button type="button" id="button4">4</button> 
    <button type="button" id="button5">5</button> 
    <button type="button" id="button6">6</button> 
    <button type="button" id="button7">7</button> 
    <button type="button" id="button8">8</button> 
    <button type="button" id="button9">9</button> 
    <button type="button" id="button10">10</button> 
    <button type="submit" class="input submit">Submit</button> 
</form> 
<p class="explanation">Not likely............................................................Very likely</p> 


<script> 

var userRating 

document.getElementById('button1').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 1; 
} 
document.getElementById('button2').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 2; 
} 
document.getElementById('button3').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 3; 
} 
document.getElementById('button4').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 4; 
} 
document.getElementById('button5').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 5; 
} 
document.getElementById('button6').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 6; 
} 
document.getElementById('button7').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 7; 
} 
document.getElementById('button8').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 8; 
} 
document.getElementById('button9').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 9; 
} 
document.getElementById('button10').onclick = function() { 
    console.log(this.id + " was clicked") 
    userRating = 10; 
} 


</script> 

В настоящее время я пытаюсь выяснить, как получить Подчинитесь на работу. Я хочу, чтобы пользователь нажал кнопку, которая представляет их оценку, а затем нажмите кнопку «Отправить», чтобы зарегистрировать их счет. Прямо сейчас, я просто хочу, чтобы их оценка отображалась на консоли, когда они попали в submit, но в конечном итоге она будет сохранена на сервере, и это будет просто виджет, который появляется на экране в браузере. Я начинаю делать это в вакууме, чтобы помочь себе учиться. Я был бы признателен, если бы кто-то указал мне в правильном направлении или дал мне подсказку. Это мой первый вкус JavaScript, поэтому я все еще участвую. Благодаря!

+0

В вашем вопросе не хватает информации. Как регистрируется счет? Вам нужно отправить счет на сервер? Вы хотите вызвать загрузку страницы или хотите, чтобы это произошло в фоновом режиме? и т. д. – Comptonburger

+0

Я только что редактировал мой вопрос, чтобы быть более ясным, извините! – Spance

+0

Почему вы не используете переключатели для выбора? – Barmar

ответ

1

Точно так же, как вы добавили обработчиков onclick на кнопки, вы можете добавить обработчик onsubmit к форме.

document.getElementById('myForm').onsubmit = function() { 
    console.log(userRating); 
} 
Смежные вопросы