Jump to content
SkyRanger

Issue with PHP

Recommended Posts

Trying to add a select drop down that contains php

 $(wrapper).append('<div><input type="hidden" name="input_array_kuemid[]" value=""/><input type="text" name="input_array_email[]" placeholder="Email Address" /> <input type="text" name="input_array_name[]" placeholder="Email Address Owner" /><select name="input_array_queue[]" size="1"><option selected="selected" value="">Current Job</option><--php mysql output code needs to be here---></select> <a href="javascript:void(0);" class="remove_field">Remove</a></div>');
        }
    });

php code that needs to show

<?php
	$kudoqulist = $wpdb->get_results( "SELECT kuqudept from $tableofname" );
foreach ($kudoqulist as $kuque) {
			if($kuque->kuqudept !=''){
		echo  "<option value=" .$kuque->kuqudept. ">" .$kuque->kuqudept. "</option>";
		}
		}
?>

Share this post


Link to post
Share on other sites

a) Use AJAX to fetch the HTML
b) Use AJAX to fetch the options as JSON and add them to the <select> with Javascript

Share this post


Link to post
Share on other sites

Thanks requinix.  Googling now how to do this.  (confusing as all heck but should be able to figure it out eventually    lol)

Share this post


Link to post
Share on other sites

Trying to to pull data out to echo for json but getting [ ] results

function get_queue() {
 
	global $wpdb;	

	$tableofname= $wpdb->prefix.'kudos_queue';
	
    $data = $wpdb->get_results("select kuqudept from $tableofname");
    
    $job_array = array();

    foreach ($data as $kuque) {
			if($kuque->kuqudept !=''){
				$job_array[] = array (
		$job_array => $kuque->kuqudept
		);
		}
		return json_encode($job_array);
		}
		
	}
 echo '<pre>';
 print_r(get_queue());
 echo '</pre>';

 

Share this post


Link to post
Share on other sites

Set aside that foreach... thing for the moment and just do a json_encode of $data.

Share this post


Link to post
Share on other sites

That works.

Pulled:

[{"kuqudept":""},{"kuqudept":""},{"kuqudept":""},{"kuqudept":"Tech Support"},{"kuqudept":"AR"},{"kuqudept":"PNI"}]

  but now just need to get rid of the empty columns

Share this post


Link to post
Share on other sites

And that is did.  Thanks requinix

 $data = $wpdb->get_results("select kuqudept from $tableofname where trim(coalesce(kuqudept, '')) <>''");

 

Share this post


Link to post
Share on other sites

Select not populating with json

jobqueue.json file

[{"kuqudept":"Tech Support"},{"kuqudept":"AR"},{"kuqudept":"PNI"},{"kuqudept":"Shared"},{"kuqudept":"Mobile"}]

php page:

<script type="text/JavaScript">

    var $select = $('#jobqueue');</code>
 
    //request the JSON data and parse into the select element
    $.getJSON('C:\Ampps\www\wp-content\plugins\kudos\admin\js\jobqueue.json', function(data){ 
 
      //clear the current content of the select
      $select.html('');
 
      //iterate over the data and append a select option
      $.each(data.jobqueue, function(key, val){ 
        $select.append('<option id="' + val.kuqudept + '">' + val.kuqudept + '</option>');
      })
    });
  </script>

<select id="jobqueue"></select>

C:\Ampps\www\wp-content\plugins\kudos\admin\js\ <- this is going to change once  I can figure out how to auto fill this depending on site owners url

Share this post


Link to post
Share on other sites
54 minutes ago, SkyRanger said:

C:\Ampps\www\wp-content\plugins\kudos\admin\js\ <- this is going to change once  I can figure out how to auto fill this depending on site owners url 

All WordPress AJAX requests are routed through admin_ajax.php. You need to supply an 'action' index in your passed array, then use the 'wp_ajax_{your-action}' and 'wp_ajax_nopriv_{your-action}' hooks. See here for further information.

Share this post


Link to post
Share on other sites

This works (JSON data stored in hidden input field)

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $().ready( function() {
        var select = $('#jobqueue');
     
        //request the JSON data and parse into the select element
         
          var data = JSON.parse($("#jobdata").val())
          //clear the current content of the select
          select.html('');
     
          //iterate over the data and append a select option
          $.each(data, function(key, val){ 
            select.append('<option id="' + val.kuqudept + '">' + val.kuqudept + '</option>');
          })
        
    })    
</script>
</head>
<body>
    <input type="hidden"  id="jobdata" value='[{"kuqudept":"Tech Support"},{"kuqudept":"AR"},{"kuqudept":"PNI"},{"kuqudept":"Shared"},{"kuqudept":"Mobile"}]'>
    <select id="jobqueue"></select>
</body>
</html>

 

Share this post


Link to post
Share on other sites

Just my 0.02 worth...

You seem to be over-complicating the json array that you are passing. A simpler structure would do the same job

<?php
$a = ['Tech Support', 'AR', 'PNI', 'Shared', 'Mobile'];
$j = json_encode($a);
?>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $().ready( function() {
        var select = $('#jobqueue');
     
        //request the JSON data and parse into the select element
         
          var data = JSON.parse($("#jobdata").val())
          //clear the current content of the select
          select.html('');
     
          //iterate over the data and append a select option
          $.each(data, function(key, val){ 
            select.append('<option id="' + val + '">' + val + '</option>');
          })
        
    })    
</script>
</head>
<body>
    <input type="hidden"  id="jobdata" value='<?=$j?>'>
    <select id="jobqueue"></select>
</body>
</html>

Share this post


Link to post
Share on other sites

Thanks maxxd.  Yeah I need to sort out my script to enable it in my plugin but first I need to start to sort out the mess I got myself into beginning at the start of this thread which caused the whole issue.

Thanks Barand for the start of what I need to do. Only one question though and I know you must think I am an idiot...lol at times I think I am but how would I get:

[{"kuqudept":"Tech Support"},{"kuqudept":"AR"},{"kuqudept":"PNI"},{"kuqudept":"Shared"},{"kuqudept":"Mobile"}]

To show as this

'Tech Support', 'AR', 'PNI', 'Shared', 'Mobile']

Share this post


Link to post
Share on other sites

Option 1 - change the way you create the original data

Option 2 -

$orig = '[{"kuqudept":"Tech Support"},{"kuqudept":"AR"},{"kuqudept":"PNI"},{"kuqudept":"Shared"},{"kuqudept":"Mobile"}]';
$simple = json_encode(array_map( function($v) { return $v['kuqudept'];}, json_decode($orig, 1)));

echo $simple;                //--> ["Tech Support","AR","PNI","Shared","Mobile"]

$simple will now contain the encoded siple verion

Share this post


Link to post
Share on other sites

Having issue having it output in my script.  I can have it display outside the wrapper and I can have it display without the <input type="hidden"  id="jobdata" value='<?=$jobqueue?>'> but how can I get it to show in the wrapper?  This is currently in the wrapper:

<select id="jobqueue" name="input_array_queue[]"></select>
$(document).ready(function() {
    var max_fields = 10; //Maximum allowed input fields 
    var wrapper    = $(".wrapper"); //Input fields wrapper
    var add_button = $(".add_fields"); //Add button class or ID
	var x = 1; //Initlal input field is set to 1
	
	var select = $('#jobqueue');
     
        //request the JSON data and parse into the select element
         
          var data = JSON.parse($("#jobdata").val())
          //clear the current content of the select
          select.html('');
     
          //iterate over the data and append a select option
          $.each(data, function(key, val){ 
            select.append('<option id="' + val + '">' + val + '</option>');
          })
	
	
	//When user click on add input button
	$(add_button).click(function(e){
        e.preventDefault();
		//Check maximum allowed input fields
        if(x < max_fields){ 
            x++; //input field increment
			 //add input field
            $(wrapper).append('<div><input type="hidden" name="input_array_kuemid[]" value=""/><input type="text" name="input_array_email[]" placeholder="Email Address" /> <input type="text" name="input_array_name[]" placeholder="Email Address Owner" /> <select id="jobqueue" name="input_array_queue[]"></select><a href="javascript:void(0);" class="remove_field">Remove</a></div>');
        }
    });
	
    //when user click on remove button
    $(wrapper).on("click",".remove_field", function(e){ 
        e.preventDefault();
		$(this).parent('div').remove(); //remove inout field
		x--; //inout field decrement
    })
});

 

Edited by SkyRanger
script mod.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.