Loading:


    Prosta ankieta AJAX i PHP przechowująca dane w pliku

    Skrypt tworzy prostą ankietę z wykorzystaniem AJAX, wyniki ankiety przechowywane są w pliku tekstowym colors.txt

    Aby skrypt działał należy w katalogu ze skryptem utworzyć plik colors.txt i jeśli to konieczne nadać prawa dostępu na 777.



    Zobacz efekt




    Napisz Artyku³

    Listing


    //index.html   #############################################

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Ajax</title>
    <link href="ajaxcss.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="ajaxcore.js"></script>
    <script type="text/javascript" src="ajax.js"></script>
    </head>
    <body>
    <div id="dataDiv" class="dataDiv">
    <div style="text-align:center;width:50%;margin:2px auto;"> Wybierz kolor </div>
    <form method="get" action="ankieta.php">
    <table style="margin:0 auto;background-color: #E8E8E8;">
      <tr>
        <td>czerwony</td>
        <td>
          <input type="radio" name="vote" value="czerwony">
        </td>
      </tr>
      <tr>
        <td>zielony</td>
        <td>
          <input type="radio" name="vote" value="zielony">
        <td>
      </tr>
      <tr>
        <td>niebieski</td>
        <td>
          <input type="radio" name="vote" value="niebieski">
        <td>
      </tr>
      <tr>
        <td>fioletowy</td>
        <td>
          <input type="radio" name="vote" value="fioletowy">
        <td>
      </tr>
      <tr>
        <td>czarny</td>
        <td>
          <input type="radio" name="vote" value="czarny">
        <td>
      </tr>
      <tr>
        <td colspan="2">
        </td>
      </tr>
    </table>
    </form>
    <div style="width:50%;margin:10px auto;text-align:center;">
      <input type="button" value="Głosuj" id="btnGlosuj"
             class="myButton" onclick="startRequest();">
    </div>
    </div>
    </body>
    </html>





    //vote.php   #############################################

    <?php
    function vote()
    {
      if(!isSet($_GET["vote"]) || $_GET["vote"] == ""){
        echo("Nie została zaznaczona żadna z opcji.");
        return false;
      }
      else{
        $color = $_GET["vote"];
      }

      if(file_exists("colors.txt")){
        if(($fp = fopen("colors.txt", "r+")) === false){
          echo("Błąd serwera. Głos nie został uwzględniony.");
          return false;
        }
      }
      else{
        if(($fp = fopen("colors.txt", "w+")) === false){
          echo("Błąd serwera. Głos nie został uwzględniony.");
          return false;
        }
      }

      $czerwony = intval(fgets($fp));
      $zielony = intval(fgets($fp));
      $niebieski = intval(fgets($fp));
      $fioletowy = intval(fgets($fp));
      $czarny = intval(fgets($fp));

      switch($color){
        case "czerwony":$czerwony++;break;
        case "zielony":$zielony++;break;
        case "niebieski":$niebieski++;break;
        case "fioletowy":$fioletowy++;break;
        case "czarny":$czarny++;break;
      }
      fseek($fp, 0);
      fputs($fp, $czerwony."\r\n");
      fputs($fp, $zielony."\r\n");
      fputs($fp, $niebieski."\r\n");
      fputs($fp, $fioletowy."\r\n");
      fputs($fp, $czarny."\r\n");
      fclose($fp);
      return true;
    }

    function show()
    {
      if(file_exists("colors.txt")){
        if(($fp = fopen("colors.txt", "r")) === false){
          echo("Błąd serwera. Wyniki ankiety nie są dostępne.");
          return;
        }
      }
      else{
        if(($fp = fopen("colors.txt", "w+")) === false){
          echo("Błąd serwera. Wyniki ankiety nie są dostępne.");
          return;
        }
      }

      $czerwony = intval(fgets($fp));
      $zielony = intval(fgets($fp));
      $niebieski = intval(fgets($fp));
      $fioletowy = intval(fgets($fp));
      $czarny = intval(fgets($fp));

      $votes_no = $czerwony + $zielony + $niebieski + $fioletowy + $czarny;
      $votes_no == 0?$votes_no = 1:0;

      $czerwony_proc = sprintf("%.2f", $czerwony * 100 / $votes_no);
      $zielony_proc = sprintf("%.2f", $zielony * 100 / $votes_no);
      $niebieski_proc = sprintf("%.2f", $niebieski * 100 / $votes_no);
      $fioletowy_proc = sprintf("%.2f", $fioletowy * 100 / $votes_no);
      $czarny_proc = sprintf("%.2f", $czarny * 100 / $votes_no);
    ?>
    <table border='0' cellpadding="0" cellspacing="0">
    <tr style="background-color:#F0F0F0">
      <td>Nazwa koloru</td>
      <td>Liczba głosów</td>
      <td>Procent głosów</td>
    </tr>
    <tr>
      <td>czerwony</td><td> <?php echo $czerwony; ?> </td>
      <td><?php echo $czerwony_proc; ?></td>
    </tr>

    <tr>
      <td>zielony</td><td> <?php echo $zielony; ?> </td>
      <td><?php echo $zielony_proc; ?></td>
    </tr>

    <tr>
      <td>niebieski</td><td> <?php echo $niebieski; ?> </td>
      <td><?php echo $niebieski_proc; ?></td>
    </tr>

    <tr>
      <td>fioletowy</td><td> <?php echo $fioletowy; ?> </td>
      <td><?php echo $fioletowy_proc; ?></td>
    </tr>

    <tr>
      <td>czarny</td><td> <?php echo $czarny; ?> </td>
      <td><?php echo $czarny_proc; ?></td>
    </tr>
    </table>

    <?php
    }

    if(vote()){
      show();
    }
    ?>




    //ajaxcss.css   #############################################

    .mainDiv
    {
      color: #333333;
      position: relative;
      background-color: #EFEFEF;
      border: 1px solid #000000;
      margin: 10px 10px 10px 10px;
      padding: 14px 14px 14px 14px;
      width: 350px;
      visibility: visible;
    }

    .dataDiv
    {
      color: #333333;
      position: relative;
      background-color: #ffffff;
      border: 1px solid #000000;
      margin: 10px 10px 10px 10px;
      padding: 14px 14px 14px 14px;
      width: 420px;
      visibility: visible;
    }

    .myButton
    {
      font-family:helvetica,sans-serif;
      font-size:84%;
      font-weight:bold;
      border:1px solid;
      border-top-color:#696;
      border-left-color:#696;
      border-right-color:#363;
      border-bottom-color:#363;
      width:120px;
      margin:5px;
    }

    .myTextInput
    {
      border:1px solid;
      background-color: #F8F8F8;
      border-top-color:#696;
      border-left-color:#696;
      border-right-color:#363;
      border-bottom-color:#363;
      width:70%;
    }



    //ajaxcore.js   #############################################

    function getXMLHttpRequestObject()
    {
      try{
        return new XMLHttpRequest();
      }
      catch(e){
        try{
          return new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(e){
          return false;
        }
      }
    }

    function startGETRequest(url, onComplete, onEnd)
    {
      var XMLHttpRequestObject = getXMLHttpRequestObject();
      if(XMLHttpRequestObject){
        XMLHttpRequestObject.open("GET", url);
        XMLHttpRequestObject.onreadystatechange = function()
        {
          if (XMLHttpRequestObject.readyState == 4){
            if(XMLHttpRequestObject.status == 200){
              var responseXML = XMLHttpRequestObject.responseXML;
              var responseText = XMLHttpRequestObject.responseText;
              onComplete(responseText, responseXML);
            }
            delete XMLHttpRequestObject;
            onEnd();
          }
        }
        XMLHttpRequestObject.send(null);
      }
    }

    function startPOSTRequest(url, params, onComplete, onEnd)
    {
      var XMLHttpRequestObject = getXMLHttpRequestObject();
      if(XMLHttpRequestObject){
        XMLHttpRequestObject.open("POST", url);
        XMLHttpRequestObject.setRequestHeader(
          'Content-Type', 'application/x-www-form-urlencoded');
        XMLHttpRequestObject.onreadystatechange = function()
        {
          if (XMLHttpRequestObject.readyState == 4){
            if(XMLHttpRequestObject.status == 200){
              var responseXML = XMLHttpRequestObject.responseXML;
              var responseText = XMLHttpRequestObject.responseText;
              onComplete(responseText, responseXML);
            }
            delete XMLHttpRequestObject;
            onEnd();
          }
        }
        XMLHttpRequestObject.send(params);
      }
    }


    //ajax.js   #############################################

    function startRequest(param)
    {
      var btnGlosuj = document.getElementById("btnGlosuj");
      btnGlosuj.disabled = true;

      var radioGroup = document.forms[0].vote;
     
      for(i = 0; i < radioGroup.length; i++){
        if(radioGroup[i].checked == true){
          url = "vote.php?vote=";
          url += radioGroup[i].value;
          startGETRequest(url, onComplete, onEnd);
          return;
        }
      }
      alert("Proszę zaznaczyć jedną z opcji.");
    }

    function onComplete(text, xml)
    {
      var dataDiv = document.getElementById("dataDiv");
      dataDiv.innerHTML = text;
    }

    function onEnd()
    {
    }
     




    Dodano przez: igor
    Ranga: Administrator serwisu Punktów: 0
    Komentarze użytkowników
      • Tre¶æ komentarza
        Kod do komentarza (opcjonalnie)
        PHP JavaScript MySQL Smarty SQL HTML CSS ActionScript
        Autor
        Token
        token

         

         








    funkcje.net
    Wszelkie prawa zastrzeżone©. | Funkcje.net 2008-2025 v.1.5 | design: diviXdesign & rainbowcolors