SitePoint Sponsor

User Tag List

Page 2 of 3 FirstFirst 123 LastLast
Results 26 to 50 of 73
  1. #26
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Good news
    I'll refactor the code this evening and post back here.
    In the meantime do try and have a look at it and understand what we are doing.

  2. #27
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    shall do thank you ill try get my head around it properly

  3. #28
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Hi,

    So I refactored the code a little:

    Code:
    <!DOCTYPE HTML> 
    <html> 
      <head> 
        <meta charset="utf-8"> 
        <title>SMS Display Admin</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /> 
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
        <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> 
        <style type="text/css"> 
          div {text-align: center}
          .results { margin-top: 15px; }
        </style> 
      </head>
      
      <body>
        <div data-role="page" id="admin" data-theme="b"> 
          <h2>SMS Display Admin</h2> 
          <div> 
            <a href="#newsms"><button data-inline="true">New SMS Message</button></a> 
            <a href="#removesms"><button data-inline="true">Remove a SMS</button></a> 
          </div> 
          <div> 
            <a href="#newadvert"><button data-inline="true">New Advert Message</button></a> 
            <a href="#removeadvert"><button data-inline="true">Remove a Advert</button></a> 
          </div> 
          <div> 
            <a href="#newbadword"><button data-inline="true">New Bad Word</button></a> 
            <a href="#removebadword"><button data-inline="true">Remove a badword</button></a> 
          </div> 
        </div> 
        
        <!--New SMS Page --> 
        <div data-role="page" id="newsms" data-theme="b"> 
          <div id="SMSinput"> 
            <form action="submit.php" method="post" id="newSMSForm" class="newButtonForm"> 
              <label for="newsms"><h2>SMS Input:</h2></label> 
              <input name="content" type="text" size="160" data-mini="true" id="newsms"/> 
              <input type="hidden" name="sender" value="4477777777777"> 
              <input type="hidden" name="inNumber" value="447786202125"> 
              <input type="hidden" name="email" value="none"> 
              <input type="hidden" name="credits" value="2501"> 
              <input type="hidden" name="forward" value="0"> 
              <input type="hidden" name="messagesent" value="0"> 
              <input name="newsms" data-role="button" data-inline="true" type="submit" value="submit" />
            </form>
            <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          </div> 
          <div class="results"></div>
        </div> 
        <!--End SMS Page -->
        
        <!--New Advert Page --> 
        <div data-role="page" id="newadvert" data-theme="b"> 
          <form action="submit.php" method="post" id="newAdvertForm" class="newButtonForm"> 
            <label for="newadvert"><h2>New Advert:</h2></label> 
            <input name="newadvert" type="text" size="160" id="newadvert" /> 
            <input name="newad" data-role="button" data-inline="true" type="submit" value="submit" /> 
          </form> 
          <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          <div class="results"></div>
        </div> 
        <!--End Advert Page --> 
        
        <!--New Bad Word Page --> 
        <div data-role="page" id="newbadword" data-theme="b"> 
          <form action="submit.php" method="post" id="newBadWordForm" class="newButtonForm"> 
            <label for="newbadword"><h2>New Bad Word:</h2></label> 
            <input name="newbadword" type="text" size="160" id="newbadword" /> 
            <input name="badword" data-role="button" data-inline="true" type="submit" value="submit" />
          </form> 
          <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          <div class="results"></div>
        </div> 
        <!--End Bad Word Page -->
        
        <script>
          (function(){
            function getFormValues(form){
              var $inputs = $('#' + form + ' :input'), 
                  values = {};
                  
              $inputs.each(function() {
                values[this.name] = this.value;
              });
              
              return $.extend(values, {sender: form});
            }
            
            function makeAjaxRequest(values){
              $.ajax({
                type : "POST",
                url : "submit.php",
                data: values,
                success : function(res) {
                  $(".results").html(res);
                  $("input[type=text]").val("");
                }
              });
            }
            
            $(".newButtonForm").on("submit", function(){
              var values = getFormValues(this.id);
              makeAjaxRequest(values);
      
              return false;
            });
            
            $(".back").on("click", function(){
              $(".results").html("");
            });
          })()
        </script>
      </body>
    </html>
    It can still be improved a bit, but let's move on to the removing side of things.
    Currently it looks like this:

    Code:
    <!--Remove SMS--> 
    <div data-role="page" id="removesms" data-theme="b"> 
      <form action="submit.php"  method="post"> 
        <h2>SMS Removal</h2>
        <label for="smsid" class="select"><h2>Message:</h2></label> 
        <select name="smsid" id="smsid" data-mini="true"> 
          <?php 
            $listsms = mysql_query("SELECT * FROM `texts` WHERE `content` IS NOT NULL AND `messagesent` = 0 LIMIT 5");  //Grab 5 messages to display 
            while ($row = mysql_fetch_array($listsms)) {  
              echo ('<option value="'.$row['id'].'">'.$row['content'].'</option>');
            }
          ?> 
        </select> 
        <input name="removesms" type="submit" value="submit" data-role="button" data-inline="true" data-theme="b" />
        <a href="#admin"><button data-inline="true">back</button></a> 
      </form>
    </div> 
    <!--End Remove SMS-->
    It seems that when a user hits the "Remove SMS" you want to grab the last five SMSs and display them as a drop down.
    Is this correct?

  4. #29
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the extra code worked perfectly.

    yeah so when a user wants to remove a sms advert or bad word it needs to submit and action the removal from the database and then refresh the page so the removed item is no longer in the dropdown

  5. #30
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by txt3rob View Post
    the extra code worked perfectly.
    Good, good

    Quote Originally Posted by txt3rob View Post
    yeah so when a user wants to remove a sms advert or bad word it needs to submit and action the removal from the database and then refresh the page so the removed item is no longer in the dropdown
    So, staying with the "Remove SMS" what should the user see in the dropdown the first time they visit the page?
    The last five SMSs?

    The reason I ask, is that we are going to need some test data to remove.
    Could you provide an example?

  6. #31
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    check your PM i sent for the link and that has some data in there i can add words for testing.

  7. #32
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    You sure?
    No PMs received, yet.

  8. #33
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    check the PM i sent you when the thread was first started if you have deleted it let me know and ill re link you

  9. #34
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Ok, got the PM.

    What I'm actually getting at is to try and understand how the removal functionality works in your app.
    This is important, as it makes a difference as to how we approach the AJAX stuff.

    This is how I imagine what you are trying to do:

    You have a database full of SMSs.
    The user visits the "Remove SMS" page and sees a list of the five most recent SMSs.
    The user can then select one SMS to remove in the dropdown.
    The user then presses submit.
    The SMS is removed from the database.
    The list is updated to show the most recent five SMSs

    E.g.

    There are 10 SMSs in the database with the ids 1 - 10
    The user visits the page and sees SMSs 6 - 10 in the drop down.
    The user selects number 7 and presses submit.
    SMS number 7 is deleted from the DB.
    The drop down updates to show the latest five SMSs, which would now be numbers 5, 6, 8, 9, 10

    Is that correct?

  10. #35
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    that is correct.

    the dropdown list is populated by a myquery and the submit button post's the ID of the sms to the query which deletes the row with the id number out of the database

  11. #36
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Ok then, I think the best way to proceed is like this:

    Keep the PHP out of your HTML page.

    Instead, we'll create a JS function, that when the page loads (or is refreshed) submits an AJAX request to a different PHP script ("remove.php" or similar).
    This script will get the latest five SMSs out of the database and assemble a bunch of <option> tags, inserting the correct information at the correct point.
    This is untested, but something like this should do:

    PHP Code:
    <?php 
      $listsms 
    mysql_query("SELECT * FROM `texts` WHERE `content` IS NOT NULL AND `messagesent` = 0 LIMIT 5");
      
    $opts ""
      
    while ($row mysql_fetch_array($listsms)) {  
        
    $opts . ('<option value="'.$row['id'].'">'.$row['content'].'</option>');
      }
      echo 
    $opts;
    The PHP script will return this to the JS function, which will then insert it into the <select> tag.
    That takes care of populating the drop down menu when the page loads.

    Then, when the user selects one of these SMSs and presses submit, we can send another request to "remove.php", including some kind of flag, so that the PHP script knows it has to delete the SMS, as well as the id of the SMS to be deleted.

    Once the PHP script has deleted the SMS from the DB, it can fetch the most recent five SMSs (as above), then return that to the JavaScript.
    The JavaScript can remove the now out-of-date <option> tags from the <select> tag, then, in their place, insert the current <option> tags it has received from the PHP script.
    And Hey Presto! The SMS has been removed from the DB and the <select> menu has been updated on the page.

    Does this sound ok to you or have I missed / overlooked anything?

  12. #37
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    currently on my submit.php i have the following
    PHP Code:
    else if  ($_POST['removesms'])  {

    $smsid $_POST['smsid'];        
    // Remove SMS
      
    $removesms mysql_query("DELETE FROM `".$texts."` WHERE `id` = ".$smsid.";");
      echo(
    'SMS: '.$smsid.' has been removed from the database');

    where possible i would like to keep the php in the main index so that i only require 2 scripts for the whole admin

  13. #38
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    So you want to do everything in submit.php (as opposed to two different files)?
    Apart from that is what I wrote above ok or have I missed / overlooked anything?

  14. #39
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no everything looks spot on to me.

    like i say i have similar thing in the index.php for the dropdown menu for the SMS that's to be removed and for the removal i would just need it to post the ID to submit.php for removal and then echo the response and refresh the page so that the removed item is gone

  15. #40
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Yeah, if we implement this for adverts, it'll be a breeze to implement for text messages etc.
    Leave it with me and I'll post something later on.

  16. #41
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nice one thanks for you support

  17. #42
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    So then, this is a bit more complicated than the previous examples, but here we go:

    Code:
    <!DOCTYPE HTML> 
    <html> 
      <head> 
        <meta charset="utf-8"> 
        <title>SMS Display Admin</title> 
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /> 
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
        <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> 
        <style type="text/css"> 
          div {text-align: center}
          .results { margin-top: 15px; }
        </style> 
      </head>
      
      <body>
        <div data-role="page" id="admin" data-theme="b"> 
          <h2>SMS Display Admin</h2> 
          <div> 
            <a href="#newsms"><button data-inline="true">New SMS Message</button></a> 
            <a href="#removesms"><button data-inline="true">Remove a SMS</button></a> 
          </div> 
          <div> 
            <a href="#newadvert"><button data-inline="true">New Advert Message</button></a> 
            <a href="#removeadvert"><button data-inline="true">Remove a Advert</button></a> 
          </div> 
          <div> 
            <a href="#newbadword"><button data-inline="true">New Bad Word</button></a> 
            <a href="#removebadword"><button data-inline="true">Remove a badword</button></a> 
          </div> 
        </div> 
        
        <!--New SMS Page --> 
        <div data-role="page" id="newsms" data-theme="b"> 
          <div id="SMSinput"> 
            <form action="submit.php" method="post" id="newSMSForm" class="ajaxForm" data-action="new"> 
              <label for="newsms"><h2>SMS Input:</h2></label> 
              <input name="content" type="text" size="160" data-mini="true" id="newsms"/> 
              <input type="hidden" name="sender" value="4477777777777"> 
              <input type="hidden" name="inNumber" value="447786202125"> 
              <input type="hidden" name="email" value="none"> 
              <input type="hidden" name="credits" value="2501"> 
              <input type="hidden" name="forward" value="0"> 
              <input type="hidden" name="messagesent" value="0"> 
              <input name="newsms" data-role="button" data-inline="true" type="submit" value="submit" />
            </form>
            <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          </div> 
          <div class="results"></div>
        </div> 
        <!--End SMS Page -->
        
        <!--New Advert Page --> 
        <div data-role="page" id="newadvert" data-theme="b"> 
          <form action="submit.php" method="post" id="newAdvertForm" class="ajaxForm" data-action="new"> 
            <label for="newadvert"><h2>New Advert:</h2></label> 
            <input name="newadvert" type="text" size="160" id="newadvert" /> 
            <input name="newad" data-role="button" data-inline="true" type="submit" value="submit" /> 
          </form> 
          <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          <div class="results"></div>
        </div> 
        <!--End Advert Page --> 
        
        <!--New Bad Word Page --> 
        <div data-role="page" id="newbadword" data-theme="b"> 
          <form action="submit.php" method="post" id="newBadWordForm" class="ajaxForm" data-action="new"> 
            <label for="newbadword"><h2>New Bad Word:</h2></label> 
            <input name="newbadword" type="text" size="160" id="newbadword" /> 
            <input name="badword" data-role="button" data-inline="true" type="submit" value="submit" />
          </form> 
          <a href="#admin" class="back"><button data-inline="true">Back</button></a>
          <div class="results"></div>
        </div> 
        <!--End Bad Word Page -->
        
        <!--Remove SMS--> 
        <div data-role="page" id="removesms" data-theme="b"> 
          <form action="submit.php"  method="post" id="removeSMSForm" class="ajaxForm" data-action="remove"> 
            <h2>SMS Removal</h2>
            <label for="smsid" class="select"><h2>Message:</h2></label> 
            <select name="smsid" id="smsid" data-mini="true"></select>        
            <input name="removesms" type="submit" value="submit" data-role="button" data-inline="true" data-theme="b" />
            <a href="#admin"><button data-inline="true">back</button></a> 
          </form>
        </div> 
        <!--End Remove SMS-->  
           
        <script>
          (function(){
            function populateDropdown(values){
              $.extend(values, {sender: "removeSMSForm"});
              makeAjaxRequest(values, function(res){
                $("#smsid").html(res).selectmenu("refresh");
              });
            }
            
            function getFormValues(form){
              var $inputs = $('#' + form + ' :input'), 
                  values = {};
                  
              $inputs.each(function() {
                values[this.name] = this.value;
              });
              
              return $.extend(values, {sender: form});
            }
            
            function makeAjaxRequest(values, callBack){
              $.ajax({
                type : "POST",
                url : "submit.php",
                data: values,
                success : function(res) {
                  callBack(res);
                }
              });
            }
            
            $(".ajaxForm").on("submit", function(){
              var values = getFormValues(this.id),
                  action = $(this).data("action"),
                  callBack;
                  
              if(action === "new"){
                callBack = function(res){
                  $(".results").html(res);
                  $("input[type=text]").val("");
                }
              } else {
                callBack = function(res){
                  populateDropdown(values);
                }
              }
              
              makeAjaxRequest(values, callBack)
              return false;
            });
            
            $(".back").on("click", function(){
              $(".results").html("");
            });
            
            populateDropdown({});
          })()
        </script>
      </body>
    </html>
    PHP Code:
    <?php 
    // Establish database connection here

    $sender $_POST['sender'];
    $sms = array(
      
    "0" => "SMS 1"
      
    "1" => "SMS 2",
      
    "2" => "SMS 3",
      
    "3" => "SMS 4",
      
    "4" => "SMS 5"
    );

    function 
    getLastFiveSMS(){
      global 
    $sms;
      
    $retVal "<option></option>";
      foreach (
    $sms as $k => $v){
        
    $retVal .= "<option value='" $k "'>" $v "</option>";
      }
      return 
    $retVal;
    }


    switch(
    $sender){
      case 
    "newSMSForm":
        
    $content $_POST['content'];
        
    $retVal "A new SMS '" $content "' was submitted.";
        break;
      case 
    "newAdvertForm":
        
    $advert $_POST['newadvert'];
        
    $retVal "Advert: '" $advert "' has been added to the database.";
        break;
      case 
    "newBadWordForm":
        
    $badword $_POST['newbadword'];
        
    $retVal "Bad word: '" $badword "' has been added to the database.";
        break;
      case 
    "removeSMSForm":
        
    $smsid $_POST['smsid'];
        if (isset(
    $smsid)){
          global 
    $sms;
          unset(
    $sms[$smsid]);
        }
        
    $retVal getLastFiveSMS();
    }

    echo 
    $retVal;
    This all works as previously discussed, the only difference being in submit.php I have just made an array with five elements.
    Initially the form is populated with these five SMSs. If the user selects an SMS from the dropdown and submits the form, then this SMS is removed from the menu.

    Obviously where I am doing all of this nonsense with arrays, you would do your database manipulation etc.

    I've also updated the demo.

  18. #43
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cheers i will review the code and hopefully get it all sorted thank you very much for your help!!

  19. #44
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    No probs
    Let me know if you need any help implementing it for the final two buttons - it can be optimized in the same way as the previous code (for the new buttons).

  20. #45
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    PHP Code:
    !--Remove SMS-->
    <div data-role="page" id="removesms" data-theme="b"
    <form action="submit.php"  method="post" id="removeSMSForm" class="ajaxForm" data-action="remove">
    SMS Removal
    <label for="smsid" class="select">Message:</label>
    <select name="smsid" id="smsid" data-mini="true">
    <?php
    $listsms 
    mysql_query("SELECT * FROM `texts` WHERE `content` IS NOT NULL AND `messagesent` = 0 LIMIT 5");  //Grab 5 messages to display
            
    while ($row mysql_fetch_array($listsms)) { 
            echo (
    '<option value="'.$row['id'].'">'.$row['content'].'</option>'); } ?>
       </select>
    <input name="removesms" type="submit" value="submit" data-role="button" data-inline="true" data-theme="b" /><a href="#admin"><button data-inline="true">back</button></a>
      </form> </div>

      <!--End Remove SMS-->
    the dropdown isnt getting the content not sure what i've done wrong

  21. #46
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    You need to do the database lookup on the server and return the HTML for the select tag to the JavaScript.

  22. #47
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i think i have an idea ill try updating the site again and see if i am right in the issue

  23. #48
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Yeah, no problem.
    Let me know how you get on.

  24. #49
    SitePoint Zealot txt3rob's Avatar
    Join Date
    Jul 2013
    Location
    Liverpool UK
    Posts
    199
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i need to put the sql query in to submit.php don't i now?

  25. #50
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,887
    Mentioned
    208 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by txt3rob View Post
    i need to put the sql query in to submit.php don't i now?
    Yup.
    I'm a bit busy today, but if you're stuck, I can have a look at this later for you.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •