SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2013
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Passing array data from JavaScript to PHP?

    Hi guys,

    This is what I've tried so far.
    HTML:
    Code:
    <html>
    <head>
    <title>Pass JS array to PHP.</title>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    
    </head>
    
    <body>
    	<h3>Pass JavaScript array into PHP.</h3>
    	<form method="POST">
    		<input type="hidden" id="jsarray" name="jsarray" value="" />
    		<input type="submit" id="#btn" value="Sumbit" />
    	</form>
    	<br>
    	<div id="response"></div>
    </body>
    
    <script type="text/javascript">
    	$(document).ready(function(){
    	    //attach to the button a click event
    	    $('#btn').click(function(){
    	        //get the value from the textbox
    	        //var jsarray = $('#jsarray').val();
    	        
    	        var jsarray = new Array();
    			jsarray[0] = "Saab";
    			jsarray[1] = "Volvo";
    			jsarray[2] = "BMW";
    			
    			$('#jsarray').val() = jsarray;
    	            
    	        if(typeof jsarray !== 'undefined') {
    				//send txt to the server
    	            //notice the function at the end. this gets called after the data has been sent
    	            $.post('<?php echo base_url('admin/js2php_proc'); ?>', {'text':jsarray}, function(data){
    	            	//Now data is an object, so put the message in the div
    	                $('#response').text(data.message);
    	            }, 'json');
    	        }
    	    });
    	});
    </script>
    </html>
    PHP:
    Code:
    	//Capture data array from AJAX and process it...
    	function js2php_proc() {
    		if(!empty($_POST)){
    		    //start an output var
    		    $output = array();
    		
    		    //do any processing here.
    		    //$output['message'] = "Array successfully sent!";
    		    $output['message'] = $_POST['jsarray'];
    		
    		    //send the output back to the client
    		    echo json_encode($output);
    		}
    	}
    Unfortunately, It doesn't work.
    Anyone would like to help me here?

    Thanks in advance.

  2. #2
    SitePoint Enthusiast
    Join Date
    Nov 2013
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think I partially solved this problem,

    HTML:
    Code:
    <html>
    <head>
    <title>Pass JS array to PHP.</title>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    
    </head>
    
    <body>
    	<h3>Pass JavaScript array into PHP.</h3>
    	<form action="<?php echo base_url('admin/js2php_proc'); ?>" method="post"> 
    		<input type="hidden" id="str" name="str" value="" /> 
    		<input type="submit" id="btn" name="submit" value="Submit" />
     	</form>
     	
    	<script> 
    		var jsarray = new Array();
    		jsarray[0] = "Saab";
    		jsarray[1] = "Volvo";
    		jsarray[2] = "BMW";		 
    		 
    		$(document).ready(function(){ 
    		  $('#btn').click(function(){ // prepare button inserts the JSON string in the hidden element 
    		    $('#str').val(JSON.stringify(jsarray)); 
    		  }); 
    		}); 
    	</script> 
    </body>
    </html>
    PHP:
    Code:
    //Capture data array from AJAX and process it...
    function js2php_proc() {
      if(isset($_POST['submit'])) 
      { 
    	$str = json_decode($_POST['str'], true); 
    	var_dump($str); 
      } 
    }
    But I need to convert this into AJAX.

    Anyone would like to help?

    Thanks in advance.

  3. #3
    SitePoint Enthusiast
    Join Date
    Nov 2013
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I already figured it out.

    Code:
    <html>
    <head>
    <title>Pass JS array to PHP.</title>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    
    </head>
    
    <body>
    	<h3>Pass JavaScript array into PHP.</h3>
    	<form id="myForm" action="<?php echo base_url('admin/js2php_proc'); ?>" method="post"> 
    		<input type="hidden" id="str" name="str" value="" /> 
    		<input type="submit" id="btn" name="submit" value="Submit" />
     	</form>
     	
    	<span id="result"></span> 	
     	
    	<script>
    		var jsarray = new Array();
    		jsarray[0] = "Saab";
    		jsarray[1] = "Volvo";
    		jsarray[2] = "BMW";		 
    	
    		$(document).ready(function(){
    			$("#btn").click( function() {
    				$.post( $("#myForm").attr("action"),
    					 $('#str').val(JSON.stringify(jsarray)),  
    			         //$("#myForm :input").serializeArray(), 
    			         function(info){ $("#result").html(info); 
    				});
    			});
    			 
    			$("#myForm").submit( function() {
    				return false;	
    			});
    			
    		});
    	</script>
    	
    </body>
    </html>
    Code:
    	//Capture data array from AJAX and process it...
    	function js2php_proc() {
    		$str = json_decode($_POST['str'], true); 
    		echo json_encode($str);
    	}
    Problem solved.


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
  •