Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New Coder
    Join Date
    Oct 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    passing large data to php server

    I have a javascript script which obtains a lot of data
    about 20 variables, 2 arrays with hundreds of or even more than 1000 elements.
    I want to pass these values to a php server and let php server write them to files(not sql database) on the server

    I know I need to use ajax, or json but I'm new to javascript and time is a bit urgent, I hope I can finish this task asap

    are there any good articles, examples on this?
    thanks!

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,216
    Thanks
    75
    Thanked 4,344 Times in 4,310 Posts
    Why do you need to use AJAX? (And JSON is just an encoding, not a way to send data in and of itself.)

    Just put the data into a hidden <form> field where you are using <form method="post"> and submit the form to your PHP page.

    Let your PHP code handle the decoding of the form field.

    Or use multiple hidden <form> fields, for that matter, putting one form element into each field. Or or or.

    I would guess the multiple <form> fields would be the fastest way to get it up an running:
    Code:
    function putArrayInForm( fldName, theArray )
    {
        var f = document.getElementById("yourFormID");
        for ( var a = 0; a < theArray.length; ++a )
        {
            var fld = document.createElement("INPUT");
            fld.name = fldName + "[]"; // PHP requires the [] for multiple same name elements
            fld.type = "hidden";
            fld.value = theArray[a];
            f.appendChild(fld);  
        }
    }
     
    ...
    var yourArray = ["some","data","lots","of","elements"];
    
    putArrayInForm( yourArray, "misc" );
    Now your PHP code can process that multiply-named field the same way it would any other. You are done.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,302
    Thanks
    10
    Thanked 586 Times in 567 Posts
    Code:
    <form id="yourFormID" method="POST" action="/test/myphp.php" ></form>
    Code:
    function sendArray( theArray )
    {
        var frm = yourFormID,
            fld = document.createElement("INPUT");
            fld.name ="data"; 
            fld.type = "hidden";
            fld.value = JSON.stringify(theArray);
            frm.appendChild(fld);  
            frm.submit();
    }
     
    var yourArray = ["some","data","lots","of","elements"];
    
    sendArray( yourArray );
    i fixed the argument order typeo and converted it to JSON, which is simpler and faster than loops and dom manipulation.

    use
    PHP Code:
    json_decode$_POST['data']) 
    or something like that and file_put_contents()? to save it on the server.
    Last edited by rnd me; 11-06-2012 at 06:39 AM. Reason: typos!
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,216
    Thanks
    75
    Thanked 4,344 Times in 4,310 Posts
    Personally, depending on what the data consisted of, I wouldn't have bothered with either multiple fields *or* JSON.

    If, for example, the data is all numeric, I would have just dumped it into a hidden field as a comma-delimited string.

    But he gave us virtually nothing to go on, so any guess is just a guess.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    New Coder
    Join Date
    Oct 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    this is really good
    but when I post to the php file, the php page will be automatically displayed on the browser in place of the original html page, how to prevent this happening, so the original html page won't get disturbed?

    Quote Originally Posted by rnd me View Post
    Code:
    <form id="yourFormID" method="POST" action="/test/myphp.php" ></form>
    Code:
    function sendArray( theArray )
    {
        var frm = yourFormID,
            fld = document.createElement("INPUT");
            fld.name ="data"; 
            fld.type = "hidden";
            fld.value = JSON.stringify(theArray);
            frm.appendChild(fld);  
            frm.submit();
    }
     
    var yourArray = ["some","data","lots","of","elements"];
    
    sendArray( yourArray );
    i fixed the argument order typeo and converted it to JSON, which is simpler and faster than loops and dom manipulation.

    use
    PHP Code:
    json_decode$_POST['data']) 
    or something like that and file_put_contents()? to save it on the server.

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,216
    Thanks
    75
    Thanked 4,344 Times in 4,310 Posts
    A couple of ways.

    One way is, indeed, to use AJAX.

    The other way is to have a hidden <iframe> and post to that iframe.

    Code:
    <form id="yourFormID" method="POST" action="/test/myphp.php" target="HIDDENFRAME">
    
    ...
    
    <iframe name="HIDDENFRAME" style="display: none;"></iframe>
    I, personally, like using a hidden iframe because it makes debugging easy: While you are developing the stuff, do *NOT* hide the iframe. And then you can have your PHP code display debug messages, progress messages, error messages, etc., and they will all be visible in the iframe. After it works, you just change to display: none and you don't even have to remove all those messages. They simply won't show. And the best part is, if you ever later have a problem, you simply remove the display: none to see the debug et al. messages again.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,302
    Thanks
    10
    Thanked 586 Times in 567 Posts
    you can use ajax as well, but it will add some degree of complication to the code you have going already. i think it's a better way of doing things than a form submit; you have options to monitor progress, there is no URL bar change by default, and you have more fine-grained control of the actual data being sent. You might not need those features.

    For a simple project that's not going to be heavily maintained stick with what works for you.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,216
    Thanks
    75
    Thanked 4,344 Times in 4,310 Posts
    > you have options to monitor progress,

    Not as many as when you use an <iframe>. There, your PHP server code can send anything back at any time (and presumabley flush the response buffer to ensure it is shown immediately). But yes.

    > there is no URL bar change by default,

    Won't be any when using an <iframe>, either.

    > and you have more fine-grained control of the actual data being sent.

    I'm not clear why you say that is true. You can enable/disable form fields, for example, to control what is sent. You can add form fields dynamically. It is true that it *MIGHT* be a tad simpler to do so with AJAX (depends on circumstances), but that's about it.

    **********

    In any case, either AJAX or hidden <iframe> work. So it's really a matter of preference.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,302
    Thanks
    10
    Thanked 586 Times in 567 Posts
    Quote Originally Posted by Old Pedant View Post
    > you have options to monitor progress,

    Not as many as when you use an <iframe>. There, your PHP server code can send anything back at any time (and presumabley flush the response buffer to ensure it is shown immediately). But yes.

    > there is no URL bar change by default,
    Won't be any when using an <iframe>, either.

    > and you have more fine-grained control of the actual data being sent.
    I'm not clear why you say that is true. You can enable/disable form fields, for example, to control what is sent. You can add form fields dynamically. It is true that it *MIGHT* be a tad simpler to do so with AJAX (depends on circumstances), but that's about it.
    it's not that one can't do many if not all the same things in a form/iframe as with ajax, it's that ajax provides a TON of built-in functionality that you don't have to re-invent.

    i used to be all about jsonp and forms, until cors became universal and i realized just how much i had been missing.

    While i agree that it's easier to get started with forms and frames, building a robust, scalable, and testable web application is easier with ajax for a lot of reasons.

    in short, ajax leverages lot's of existing infrastructure that high-level abstractions like jsonp and iframes don't provide.


    off the top of my head, compared to iframe/jsonp, ajax provides:
    1. an HTTP response status code (200, 204, 404, 302, etc)
    2. standardized state indication (readyState)
    3. intrinsic state change event handling ( onreadystatechange )
    4. ability to perform sync/async requests
    5. ability to set custom HTTP request headers
    6. ability to get HTTP response headers
    7. ability to send logically unescaped binary data (FormData, blob, text, document, etc)
    8. choice of return flavors (text, xml, ArrayBuffer, blob, etc)
    9. progress events are nice for UI and require no server-side code
    10. optional history item addition using pushState vs iframe's forcible creation
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,216
    Thanks
    75
    Thanked 4,344 Times in 4,310 Posts
    Absolutely no argument

    But as a practical matter, since he seems completely uninterested in knowing WHAT the response from the server was, the only one that MIGHT apply is number 7. And whether even that applies or not depends on the kind of data he is trying to send.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Tags for this Thread

    Posting Permissions

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