Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [php][js] 2 formularze ajax i klasyczny
Forum PHP.pl > Forum > Przedszkole
o_d
Witam,
zrobiłem Ajaxową sondę i ona sama w sobie pięknie działa. Problem pojawia się gdy w kodzie strony przed sondą dodaję dowolny inny formularz np. pole wyszukiwarki. Wtedy sonda nie działa.

Na przykładzie (pomijająć składniki początku i końca strony). Wtedy działa:
  1. <form action="<? echo $_SERVER['PHP_SELF']; ?>" onsubmit="return false" method="post" >
  2.  
  3.  <div id="poller"> 
  4.  <?
  5.  $pollerId = 1; // Id of poller
  6.  ?>
  7.  <!-- TUTAJ ANKIETA -->  
  8.  </div>
  9.  </form>

Gdy jednak przed formularzem ajaxowym występuje dowolny inny formularz, np wyszukiwarka to juz nie działa:
  1. <form method="GET" id="searchform" action="search.php">
  2.  <input type="text" value="Szukaj" name="s" id="s" onfocus="if (this.value == 'Szukaj') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Szukaj';}" />
  3.  <input type="submit" id="searchsubmit" value="." /></form>
  4.  
  5. <form action="<? echo $_SERVER['PHP_SELF']; ?>" onsubmit="return false" method="post" >
  6.  
  7.  <div id="poller"> 
  8.  <?
  9.  $pollerId = 1; // Id of poller
  10.  ?>
  11.  <!-- TUTAJ ANKIETA -->  
  12.  </div>
  13.  </form>

W czym może być problem? Oba formularze mają inne action i inny sposob wysłania danych. Proszę o wszelkie pomocne wskazówki.
Pozdrawiam
Sabistik
Tytuł tematu nie spełnia wymagań regulaminu działu przedszkole. Proszę o poprawę inaczej zostanie zamknięty. To samo tyczy się bbcode.
Crozin
Jak mamy Ci pomóc nie mając kodu JS? smile.gif
Strzelam, że źle dobierasz się do tego fomrularza.
o_d
ankieta wykorzystuje 2 pliki js:
  1. <script type="text/javascript" src="js/ajax.js"></script>
  2. <script type="text/javascript" src="js/ajax-poller.js"> </script>

ajax.js to po prostu funkcje "aktywujące" ajax, natomiast

ajax-poller.js jest strasznie dlugie wiec przytavczam tylko te najwazniejsze funkcje:
  1. function showVoteResults(pollId,ajaxIndex)
  2. {
  3.  
  4. document.getElementById('poller_waitMessage' + pollId).style.display='none';
  5.  
  6. var xml = ajaxObjects[ajaxIndex].response;
  7. xml = xml.replace(/\n/gi,'');
  8.  
  9. var reg = new RegExp("^.*?<pollerTitle>(.*?)<.*$","gi");
  10. var pollerTitle = xml.replace(reg,'$1');
  11. var resultDiv = document.getElementById('poller_results' + pollId);
  12. var titleP = document.createElement('P');
  13. titleP.className='result_pollerTitle';
  14. titleP.innerHTML = pollerTitle;
  15. resultDiv.appendChild(titleP);
  16. var options = xml.split(/<option>/gi);
  17.  
  18. pollVotes[pollId] = new Array();
  19. totalVotes[pollId] = 0;
  20. for(var no=1;no<options.length;no++){
  21.  
  22. var elements = options[no].split(/</gi);
  23. var currentOptionId = false;
  24. for(var no2=0;no2<elements.length;no2++){
  25. if(elements[no2].substring(0,1)!='/'){
  26. var key = elements[no2].replace(/^(.*?)>.*$/gi,'$1');
  27. var value = elements[no2].replace(/^.*?>(.*)$/gi,'$1');
  28.  
  29. if(key.indexOf('optionText')>=0){
  30. var pOption = document.createElement('P');
  31. pOption.className='result_pollerOption';
  32. pOption.innerHTML = value;
  33. resultDiv.appendChild(pOption);
  34.  
  35. }
  36.  
  37. if(key.indexOf('optionId')>=0){
  38. currentOptionId = value/1;
  39. }
  40.  
  41. if(key.indexOf('votes')>=0){
  42. var voteDiv = document.createElement('DIV');
  43. voteDiv.className='result_pollGraph';
  44. resultDiv.appendChild(voteDiv);
  45.  
  46. var leftImage = document.createElement('IMG');
  47. leftImage.src = voteLeftImage;
  48. voteDiv.appendChild(leftImage);
  49.  
  50.  
  51. var numberDiv = document.createElement('DIV');
  52. numberDiv.style.backgroundImage = 'url('' + voteCenterImage + '')';
  53. numberDiv.innerHTML = '0%';
  54. numberDiv.id = 'result_voteTxt' + currentOptionId;
  55. voteDiv.appendChild(numberDiv);
  56.  
  57. var rightImage = document.createElement('IMG');
  58. rightImage.src = voteRightImage;
  59. voteDiv.appendChild(rightImage);
  60.  
  61. pollVotes[pollId][currentOptionId] = value;
  62. totalVotes[pollId] = totalVotes[pollId]/1 + value/1;
  63. }
  64. }
  65. }
  66. }
  67.  
  68. var totalVoteP = document.createElement('P');
  69. totalVoteP.className = 'result_totalVotes';
  70. totalVoteP.innerHTML = txt_totalVotes + totalVotes[pollId];
  71. voteDiv.appendChild(totalVoteP);
  72.  
  73. setPercentageVotes(pollId);
  74. slideVotes(pollId,0);
  75. }
  76.  
  77. function prepareForPollResults(pollId)
  78. {
  79. document.getElementById('poller_waitMessage' + pollId).style.display='block';
  80. document.getElementById('poller_question' + pollId).style.display='none';
  81. }
  82.  
  83. function castMyVote(pollId,formObj)
  84. {
  85.  
  86. var elements = formObj.elements['vote[' + pollId + ']'];
  87. var optionId = false;
  88. for(var no=0;no<elements.length;no++){
  89. if(elements[no].checked)optionId = elements[no].value;
  90. }
  91. Poller_Set_Cookie('dhtmlgoodies_poller_' + pollId,'1',6000000);
  92. if(optionId){
  93.  
  94. var ajaxIndex = ajaxObjects.length;
  95. ajaxObjects[ajaxIndex] = new sack();
  96. ajaxObjects[ajaxIndex].requestFile = serverSideFile + '?pollId=' + pollId + '&optionId=' + optionId;
  97. prepareForPollResults(pollId);
  98. ajaxObjects[ajaxIndex].onCompletion = function(){ showVoteResults(pollId,ajaxIndex); }; // Specify function that will be executed after file has been found
  99. ajaxObjects[ajaxIndex].runAJAX(); // Execute AJAX function
  100.  
  101. }
  102. }

Zresztą... ta ankieta to ogolnie dostępny skrypt ankiety ajax dostępny na stronie:
http://www.dhtmlgoodies.com/index.html?whi...ipt=ajax-poller
Sam skrypt po dostosowaniu pod moje opcje działa pięknie. PRzestaje gdy dodaje przed nim dowolny inny formularz :/

Będę wdzięczny za wszelką pomoc!
Pozdrawiam,
Olek

z racji na ograniczoną ilość tekstu w poscie tutaj podaje kod formularza ankiety w html:
  1. <form action="<? echo $_SERVER['PHP_SELF']; ?>" onsubmit="return false" method="post" >
  2.  
  3. <div id="mainContent">
  4.  
  5. <?
  6. $pollerId = 1; // Id of poller
  7. ?>
  8. <!-- START OF POLLER -->
  9. <div class="poller">
  10.  
  11. <div class="poller_question" id="poller_question<? echo $pollerId; ?>">
  12. <?
  13.  
  14.  
  15. // Retreving poll from database
  16. $res = mysql_query("select * from poller where ID='$pollerId'");
  17. if($inf = mysql_fetch_array($res)){
  18. echo "<p class=\"pollerTitle\">".$inf["pollerTitle"]."</p>"; // Output poller title
  19.  
  20. $resOptions = mysql_query("select * from poller_option where pollerID='$pollerId' order by pollerOrder") or die(mysql_error()); // Find poll options, i.e. radio buttons
  21. while($infOptions = mysql_fetch_array($resOptions)){
  22. if($infOptions["defaultChecked"])$checked=" checked"; else $checked = "";
  23. echo "<p class=\"pollerOption\"><input$checked type=\"radio\" value=\"".$infOptions["ID"]."\" name=\"vote[".$inf["ID"]."]\" id=\"pollerOption".$infOptions["ID"]."\"><label for=\"pollerOption".$infOptions["ID"]."\" id=\"optionLabel".$infOptions["ID"]."\">".$infOptions["optionText"]."</label></p>";
  24.  
  25. }
  26. }
  27. ?>
  28. <a href="#" onclick="castMyVote(<? echo $pollerId; ?>,document.forms[0])"><img src="images/vote_button.gif"></a>
  29. </div>
  30. <div class="poller_waitMessage" id="poller_waitMessage<? echo $pollerId; ?>">
  31. Pobieranie wyników ankiety. Prosze czekać...
  32. </div>
  33. <div class="poller_results" id="poller_results<? echo $pollerId; ?>">
  34. <!-- This div will be filled from Ajax, so leave it empty --></div>
  35. </div>
  36. <!-- END OF POLLER -->
  37. <script type="text/javascript">
  38. if(useCookiesToRememberCastedVotes){
  39. var cookieValue = Poller_Get_Cookie('dhtmlgoodies_poller_<? echo $pollerId; ?>');
  40. if(cookieValue && cookieValue.length>0)displayResultsWithoutVoting(<? echo $pollerId; ?>); // This is the code you can use to prevent someone from casting a vote. You should check on cookie or ip address
  41.  
  42. }
  43. </script>
  44.  
  45.  
  46. </div>
  47. <div class="clear"></div>
  48.  
  49. </form>
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.