Tagged: 

Viewing 4 reply threads
  • Author
    Posts
    • May 12, 2016 at 12:45 am #6485
      travisloc
      Member

      I’m running piklist 0.9.9.8 and wp 4.5.2

      I’m using front end forms and trying to use the template post_meta as below:

      
$passengers = array(
	'' => 'Select'
	, 'Passenger 1' => 'Passenger 1'
	, 'Passenger 2' => 'Passenger 2'
	, 'Passenger 3' => 'Passenger 3'
	, 'Passenger 4' => 'Passenger 4'
);

piklist('field', array(
	'type' => 'group'
	, 'scope' => 'post_meta' // Not used for settings sections
	, 'field' => 'passenger_details'
	, 'columns' => 12
	, 'add_more' => true
	, 'fields' => array(
		array(
			'type' => 'select'
			, 'scope' => 'post_meta' // Not used for settings sections
			, 'field' => 'passenger_passenger_details'
			, 'label' => 'Passenger'
			, 'choices' => $passengers
			, 'attributes' => array(
				'required' => 'required'
			)
			, 'template' => 'post_meta'
		)

      My problem can be seen in the screen shot. The template shows that the HTML SELECT element should appear inside the DIV with class=’piklist-field’ as below:

      [field_wrapper]
                     <div class="%1$s piklist-field-container">
                       <div class="piklist-field-container-row">
                         <div class="piklist-label-container">
                           [field_label]
                           [field_description_wrapper]
                             <p class="piklist-field-description description">[field_description]</p>
                           [/field_description_wrapper]
                         </div>
                         <div class="piklist-field">
                           [field]
                         </div>
                       </div>
                     </div>
                   [/field_wrapper]

      However, the screen shot shows the SELECT is appearing after the last DIV. Can anyone see where I am going wrong?

      Attachments:
      You must be logged in to view attached files.
    • May 21, 2016 at 1:23 pm #6541
      Jason
      Keymaster

      Hey @travisloc!

      Out of curiosity, when you view the page source, is the div still in the wrong place? I want to rule out the possibility that it’s javascript causing the issue.

      Thanks!

    • May 21, 2016 at 5:39 pm #6542
      travisloc
      Member

      Hi Jason,

      Thanks for looking into this. When I view source the div and select is correct: 

      <div class="piklist-field"><select 
  id="_post_meta_passenger_details_0_passenger_passenger_details_0" 
  name="_post_meta[passenger_details][0][passenger_passenger_details]"
  class="_post_meta_passenger_details_passenger_passenger_details piklist-field-element" data-piklist-field-group="a8a35be" data-piklist-field-sortable="1" data-piklist-field-addmore="1" data-piklist-field-addmore-actions="1" >
          <option value="" selected="selected">Select</option>
                <option value="Passenger 1" >Passenger 1</option>
                <option value="Passenger 2" >Passenger 2</option>
                <option value="Passenger 3" >Passenger 3</option>
                <option value="Passenger 4" >Passenger 4</option>
        </select></div>

      But when viewing the page the select and div are wrong because the css for .piklist-field. is not applied to the select element.

    • May 23, 2016 at 10:44 am #6545
      Jason
      Keymaster

      Interesting, thanks for checking! That means that after the page loads some bit of javascript is moving the select element outside of the div.piklist-field parent. This is definitely a bug; I’ll make a ticket for it.

      Thanks for reporting this!

    • May 24, 2016 at 6:26 am #6546
      travisloc
      Member

      ok thanks Jason

  • Author
    Posts
Viewing 4 reply threads
  • You must be logged in to reply to this topic.