2016-02-16 4 views
0

У меня есть этот код, как форма опроса с переключателями и флажками. Я пытаюсь заполнить эту форму всеми параметрами, но форма mailto действие не выполняется, если я выбираю более 12 радио & флажков (всего) на всей странице.Не могу отправить более 12 радио и флажок в форме action mailto

Он принимает все входные данные как обычный текст, и он работает, если я выбираю менее 12 переключателей и флажков. Мне нужен пользователь, чтобы разрешить максимальный выбор, а затем отправлять данные по почте. Я не знаю JavaAPIMail сервлет, поэтому попробуйте с помощью формы action mailto.

<section> 

    <form action="MAILTO:[email protected]" method="post" enctype="text/plain">             
    <div class="title1"> 


     <ol class="list-group"> 
     <li class="list-group-item"> heading 1 : 
      <div> 
      <label class="radio-inline"><input type="radio" name="1" value="J">j</label> 
      <label class="radio-inline"><input type="radio" name="1" value="K">K</label> 
      <label class="radio-inline"><input type="radio" name="1" value="L">L</label> 
      <label class="radio-inline"><input type="radio" name="1" value="M">M</label> 
      <label class="radio-inline"><input type="radio" name="1" value="N">N</label> 
      <label class="radio-inline"><input type="radio" name="1" value="O">O</label> 
      </div> 
     </li>      
     <li class="list-group-item"> Heading 2 : 
      <div class="form-row"> 
      <textarea name ="Head2:" placeholder ="Type Here" id ="H"></textarea> 
      </div> 
     </li> 
     <li class="list-group-item"> Heading 3 : (you can select more than one option)  
      <div> 
      <label class="checkbox-inline"><input type="checkbox" name="A:" class="ipad CCBOX" value="ipad">iPad</label> 
      <label class="checkbox-inline"><input type="checkbox" name="A:" class="web CCBOX" value="web">Web</label> 
      <label class="checkbox-inline"><input type="checkbox" name="A:" class="other CCBOX" value="other">other</label> 
      </div> 
     </li>       

     <li class="list-group-item"> Heading 4: 
      <div>       
      <label class="radio-inline"><input type="radio" name="B" value="Daily">Daily</label> 
      <label class="radio-inline"><input type="radio" name="B" value="Weekly">Weekly</label> 
      <label class="radio-inline"><input type="radio" name="B" value="Biweekly">Biweekly</label> 
      <label class="radio-inline"><input type="radio" name="B" value="Monthly">Monthly</label> 
      </div> 
     </li>  




     </ol> 

     <span id="web"><h3><b>Web</b></h3> 

     <ol class="list-group" > 
      <li class="list-group-item"> Heading 6: 
      <div> 

       <label class="radio-inline"><input type="radio" name="C" value="Easy">Easy</label> 
       <label class="radio-inline"><input type="radio" name="C" value="Neither easy nor difficult">Neither easy nor difficult</label> 
       <label class="radio-inline"><input type="radio" name="C" value="Difficult">Difficult</label> 
      </div> 
      </li>      

      <li class="list-group-item"> Heading 7: 

      <div class="form-row"> 
       <textarea name = "Q :" placeholder = "Type Here" id = "comment-good" ></textarea> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 8: 

      <div class="form-row"> 
       <textarea name = "W" placeholder = "Type Here" id = "comment-lack" ></textarea> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 9 

      <div class="form-row"> 
       <textarea name = "E" placeholder = "Suggestions" id = "comment-sugg"></textarea> 
      </div> 
      </li> 

     </ol></span> 

     <span id="ipad"><h3><b>ipad</b></h3> 

     <ol class="list-group"> 
      <li class="list-group-item"> Heading 9 
      <div> 

       <label class="radio-inline"><input type="radio" name="R" value="ipad Easy">Easy</label> 
       <label class="radio-inline"><input type="radio" name="R" value="ipad Neither easy nor difficult">Neither easy nor difficult </label> 
       <label class="radio-inline"><input type="radio" name="R" value="ipad Difficult">Difficult</label> 
      </div> 
      </li>      

      <li class="list-group-item"> Heading 10 
      <div class="form-row"> 
       <textarea name = "T" placeholder = "Type Here" id = "comment-goodipad"></textarea> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 11 
      <div class="form-row"> 
       <textarea name = "Y: " placeholder = "Type Here" id = "comment-lackipad" ></textarea> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 12 
      <div class="form-row"> 
       <textarea name = "U " placeholder = "Suggestions" id = "comment-suggipad" ></textarea> 
      </div> 
      </li> 

     </ol></span> 



     <span id="other"><h3><b>Other</b></h3> 

     <ol class="list-group"> 

      <li class="list-group-item"> Heading 13 
      <div class="form-row"> 
       <textarea name = "I" placeholder = "Type Here" id = "comment-asuse" ></textarea> 
      </div> 
      </li> 
      <li class="list-group-item"> O 
      <div>  
       <label class="radio-inline"><input type="radio" name="S" value="Easy">Easy</label> 
       <label class="radio-inline"><input type="radio" name="S" value="Neither Easy nor difficult">Neither Easy nor difficult</label> 
       <label class="radio-inline"><input type="radio" name="S" value="Difficult">Difficult</label> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 14 : 
      <div> 
       <label class="radio-inline"><input type="radio" name="Z" value="Yes">Yes</label> 
       <label class="radio-inline"><input type="radio" name="Z" class="csgo view" value="No">No</label> 
      </div> 
      </li>       
      <li class="list-group-item excel" > Heading 15 
      <div class="form-row"> 
       <textarea name = "X" placeholder = "Type Here" id = "comment-lackasd" ></textarea> 
      </div> 
      </li>       
      <li class="list-group-item"> Heading 16: 
      <div class="form-row"> 
       <textarea name = "V" placeholder = "Suggestions" id = "comment-suggasd" ></textarea> 
      </div> 
      </li> 

     </ol></span> 



     <h3><b>Scope</b></h3> 

     <ol class="list-group"> 
     <li class="list-group-item"> Heading 17 
      <div> 

      <label class="radio-inline"><input type="radio" name="F" value="Most of the times">Most of the times</label> 
      <label class="radio-inline"><input type="radio" name="F" value="Occasionally">Occasionally </label> 
      <label class="radio-inline"><input type="radio" name="F" value="Doesn't meet my requirements"> 
       Doesn't meet my requirements</label> 
      </div> 
     </li>      
     <li class="list-group-item"> Heading 18:  
      <div> 
      <label class="checkbox-inline"><input type="checkbox" name="d :" value="D">D</label> 
      <label class="checkbox-inline"><input type="checkbox" name="d :" value="S">S</label> 
      <label class="checkbox-inline"><input type="checkbox" name="d :" value="C">C</label> 
      <label class="checkbox-inline"><input type="checkbox" name="d :" value="M">M</label> 
      <label class="checkbox-inline"><input type="checkbox" name="d :" value="R">R</label> 


      </div> 

     </li> 
     <li class="list-group-item"> Heading 19 
      <div class="form-row"> 
      <textarea name = "hi:" placeholder = "Type Here" id = "comment-l" ></textarea> 
      </div> 
     </li>       

     <li class="list-group-item"> Heading 20 
      <div class="form-row"> 
      <textarea name = "hi2:" placeholder = "Suggestions" id = "comment-s" ></textarea> 
      </div> 
     </li> 

     </ol> 

     <h3><b>Overall Experience</b></h3> 

     <ol class="list-group"> 

     <li class="list-group-item"> Heading 21: 
      <div> 
      <label class="radio-inline"><input type="radio" name="H" value="Likely">Likely</label> 
      <label class="radio-inline"><input type="radio" name="H" value="Not-Sure">Not Sure</label> 
      <label class="radio-inline"><input type="radio" name="H" value="Unlikely">Unlikely</label> 
      </div> 
     </li>       
     <li class="list-group-item"> Heading 22: 
      <div> 
      <label class="radio-inline"><input type="radio" name="G" value="Satisfied">Satisfied</label> 
      <label class="radio-inline"><input type="radio" name="G" value="Neutral">Neutral</label> 
      <label class="radio-inline"><input type="radio" name="G" value="Dissatisfied">Dissatisfied</label> 
      </div> 
     </li>       
     <li class="list-group-item"> Heading 24: 
      <div> 
      <label class="radio-inline"><input type="radio" name="..." value="Size">Size</label> 
      <label class="radio-inline"><input type="radio" name="..." value="Competition">Competition</label> 
      <label class="radio-inline"><input type="radio" name="..." value="Mix of both">Mix of both</label> 
      </div> 
     </li>       


     <li class="list-group-item"> Please provide your overall satisfaction: 
      <input id="input-2c" class="rating" min="0" max="5" step="0.5" data-size="sm" name="rating" data-symbol="&#xf005;" data-glyphicon="false" data-rating-class="rating-fa"> 

     </li>      


     </ol> 


     <!-- form submission --> 
     <div class="wrapper"> 
     <input type="submit" value="Send" class="btn btn-primary"> 


     </div> 
     </form> 
    </div> 

</section> 

</div> 
</div> 
</div> 


</body> 
<script type="text/javascript"> 
    $('.CCBOX').click(function() { 

    $('#other').hide(); 
    $('#web').hide(); 
    $('#ipad').hide(); 

    if($(".ipad:checked").length === 1){ 
     $('#ipad').show(); 

    } 
    if($(".web:checked").length === 1){ 
     $('#web').show(); 

    } 
    if($(".other:checked").length === 1){ 
     $('#other').show(); 

    } 
    }); 
</script> 

<script type="text/javascript"> 
    $(function() { 
    $('input[name="Z"]').on('click', function() { 
     if ($(this).val() == 'No') { 
     $('.excel').show(); 
     } 
     else { 
     $('.excel').hide(); 
     } 
    }); 
    }); 

</script> 
</html> 

Проблема, с которой я столкнулась, - это когда я нажимаю кнопку отправки со всеми выбранными параметрами, почта не работает. Но если я выберу небольшое количество переключателей и флажков (максимум 12), функция почты будет работать. Пожалуйста, помогите мне, где я должен внести изменения.

+0

Какую операционную систему вы тестирование с? Какой почтовый клиент? Многие люди теперь используют электронную почту вместо почтовой почты, для этих пользователей эта форма НЕ будет работать вообще. Таким образом, вам действительно нужно выяснить, как отправить электронное письмо с помощью API или сценария сервера. Вы можете попробовать этот https://sendgrid.com или https://www.mailgun.com/. –

+0

Я использую ОС Windows 8.1 и используя атрибут атрибута тега формы mailto, сообщение метода в html5. –

+0

Вы заметили, что это происходит при проверке/снятии отметки с какого-либо конкретного радио/ящика? Некоторые из них имеют неправильные имена ('d:', '...', '1'), но я не знаю, может ли это быть причиной –

ответ

0

Когда я проверяю все и представить, я получаю по электронной почте с этим в организме:

1=O 
Head2:= 
A:=ipad 
A:=web 
A:=other 
B=Monthly 
C=Difficult 
Q := 
W= 
E= 
R=ipad Difficult 
T= 
Y: = 
U = 
I= 
S=Difficult 
Z=No 
X= 
V= 
F=Doesn't meet my requirements 
d :=D 
d :=S 
d :=C 
d :=M 
d :=R 
hi:= 
hi2:= 
H=Unlikely 
G=Dissatisfied 
...=Mix of both 
rating= 

Таким образом, ясно, что это работает для меня. Вот почему я думаю, что это проблема с os или почтовым клиентом.

Здесь со ВСЕМИ текстовых полей и текстовых полей с использованием значений:

1=O 
Head2:= 
A:=ipad 
A:=web 
A:=other 
B=Monthly 
C=Difficult 
Q :=value of Q : 
W=value of W 
E=value of E 
R=ipad Difficult 
T=value of T 
Y: =value of Y: 
U =value of U 
I=value of I 
S=Difficult 
Z=No 
X=value of X 
V=value of V 
F=Doesn't meet my requirements 
d :=D 
d :=S 
d :=C 
d :=M 
d :=R 
hi:=value of hi: 
hi2:=value of hi2: 
H=Unlikely 
G=Dissatisfied 
...=Mix of both 
rating=Satisfaction value 
+0

hmm Спасибо, я попробую с JAVA API почтовый сервлет .. ссылка, если вы могли бы отправить сюда, действительно поможет мне. Большое спасибо Ален. :) –

+0

Посмотрев немного, это самый простой API, который я могу найти: https://formspree.io/ Все, что вам нужно сделать, это заменить параметр «действие» вашей формы, и они обработают форму и отправят ее по электронной почте вы. Есть много дополнительных опций. Вы можете передать специальные поля (как скрытые поля), чтобы включить такую ​​информацию, как туда, куда вы хотите ее отправить. ex:

+0

Нет проблем Jay- можете ли вы принять мой ответ и сообщить мне, было ли это полезно (используя стрелку вверх)? –