-1

I am using contact for 7 to create form. Currently I am auto completing value under text name field from Custom post type title, see below:

$post_ids = new WP_Query(array(
'post_type' => 'Buyers', // replace with CPT name
'fields' => 'fname' // replace with custom field name
));
 $name = array();
// go through each of the retrieved ids and get the title
if ($post_ids->have_posts()):
    foreach( $post_ids->posts as $id):
        // get the post title, and apply any filters which plugins may have added
        // (get_the_title returns unfiltered value)
        $name[] = apply_filters('the_title', get_the_title($id));
    endforeach;
endif;



 <script>
$( "#autocomplete" ).autocomplete({
  source: <?php echo json_encode($name); ?>
});
</script>

Now I want to auto fill other form fields(i.e last name, address, contact info etc. ) with custom field values from post, based on above selected post title. How can we achieve this?

I want something below:

<label> Your Name </label>
<input type="text" id="name" name="name" /> 
<input readonly="readonly" type="text" id="iprice" name="iprice" size="5">
    <input readonly="readonly" type="text" id="icode" name="icode" size="3">
[submit "Send"]


$(function() { 
      $('#iprice').val("");
      $('#icode').val("");
  $("#name").autocomplete({
    source: [{"label":"Air Soft Gun","price":"212","abbrev":"BMW"},
         {"label":"Pepsi Cola Hat","price":"24","abbrev":"CRY"},
         {"label":"Candle Lights Dinner","price":"780","abbrev":"NSS"},
         {"label":"Pork Meat Ball","price":"178","abbrev":"SZK"},
         {"label":"Granny Health Supplement","price":"24","abbrev":"TYT"}],
    minLength: 2,
    select: function(event, ui) { 
      $('#iprice').val(ui.item.price);
      $('#icode').val(ui.item.abbrev);
    }
  });

  $["ui"]["autocomplete"].prototype["_renderItem"] = function( ul, item) {
    return $( "<li></li>" ) 
      .data( "item.autocomplete", item )
      .append( $( "<a></a>" ).html( item.label ) )
      .appendTo( ul );
  };

});

Label will be my post title and based on selected post tiltle, display custom fields value under price and icode.

Any help would be appreciated. Thank you in advance.

0

May be try like this:

foreach( $post_ids->posts as $id):
    // get the post title, and apply any filters which plugins may have added
    // (get_the_title returns unfiltered value)
    $name[] = apply_filters('the_title', get_the_title($id));
    $lname[] = get_post_meta($id, 'last_name', TRUE);
    $address[] = get_post_meta($id, 'address', TRUE);
    $cinfo[] = get_post_meta($id, 'contact_info', TRUE);
endforeach;
$data = ['fname'=>$name, 'lname'=>$lname, 'address'=>$address, 'cinfo'=>$cinfo];
<script>
    $( "#name" ).autocomplete({
      source: <?php echo json_encode($data['fname']]); ?>
    });
    $( "#lname" ).autocomplete({
      source: <?php echo json_encode($data['lname']]); ?>
    });
    $( "#address" ).autocomplete({
      source: <?php echo json_encode($data['address']]); ?>
    });
    $( "#cinfo" ).autocomplete({
      source: <?php echo json_encode($data['cinfo']]); ?>
    });
</script>
  • Thank you Balas for your reply. But I am not looking to search through custom fields, based one my post title auto selection, auto fill the other text fields from that post custom field info. Like the JQuery example explained when we search for first item from array "Air Soft Gun" and then after selection of that option display price and abbrev auto to the fields – Swati Aug 10 '18 at 14:05
0

I figured it out. Here is the solution:

Form Code:

<label> Your Name </label>
    <input type="text" id="name" name="name" />
        <input readonly="readonly" type="text" id="iprice" name="iprice" size="5">

PHP code

  <?php
    $post_id = array(
        'post_type' => 'your_post_type_name'
    );
    $post_data = array();
    $my_query = new WP_Query( $post_id );
    if ( $my_query->have_posts() ) {
        while ( $my_query->have_posts() ) {
            $my_query->the_post();
            $post_data[] = array(
                'label' => get_the_title($post_id->ID),
                'price' => get_post_meta( get_the_ID(), 'custom_field name', true )
            );
        }
    }
    ?>

My Script code:

<script type="text/javascript">
    $(function() { 
      $('#iprice').val("");
      $("#name").autocomplete({
        source: <?php echo json_encode( $post_data); ?>,
        minLength: 2,
        select: function(event, ui) { 
          $('#iprice').val(ui.item.price);
        }
      });

      $["ui"]["autocomplete"].prototype["_renderItem"] = function( ul, item) {
        return $( "<li></li>" ) 
          .data( "item.autocomplete", item )
          .append( $( "<a></a>" ).html( item.label ) )
          .appendTo( ul );
      };

    });
    </script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.