2016-06-23 56 views
0

重力フォームを使用してフォームを作成しています。飛行機のタイプを選択したり、異なる飛行時間、特典、その他のアドオンを追加することができます。 Gravity Formsのチェックボックスフィールドに、私が作成したカスタム投稿タイプを入力しています。重力フォームが投稿を選択すると、投稿画像が表示されます。

ユーザーがフライトやその他の特典を選択すると、その選択肢の左側に、GFのHTMLフィールドに、{all_fields}と表示されます。航空機のチェックボックスにはカスタム投稿タイプが設定されているため、その投稿タイプの特集画像を取得してHTMLフィールドの場所の上に表示する必要があります。

ここに記載されているコードは、私がカスタムポストタイプと、それらのチェックボックスを移入するために使用している機能である:

add_filter('gform_pre_render_6', 'ldm_do_bac_aircraft_large'); 
add_filter('gform_pre_validation_6', 'ldm_do_bac_aircraft_large'); 
add_filter('gform_pre_submission_filter_6', 'ldm_do_bac_aircraft_large'); 
add_filter('gform_admin_pre_render_6', 'ldm_do_bac_aircraft_large'); 

function ldm_do_bac_aircraft_large($form) { 

    foreach ($form['fields'] as &$field) { 
     if (strpos($field->cssClass, 'bac-aircraft-large') === false) { 
      continue; 
     } 

     $posts = get_posts(array(
      'numberposts' => -1, 
      'post_status' => 'publish', 
      'post_type'  => 'ldm_build_card', 
      'order'   => 'ASC', 
      'tax_query'  => array(
       array(
        'taxonomy' => 'ldm_build_card_categories', 
        'field'  => 'slug', 
        'terms'  => array('large'), 
       ), 
      ), 
     )); 

     $choices = array(); 

     foreach ($posts as $post) { 
      $choices[] = array('text' => $post->post_title, 'value' => $post->post_title); 
     } 

     $field->choices = $choices; 
    } 
    return $form; 
} 

ユーザーがいずれかを選択しLargeSuper-MidMid、またはときだから私の目標は、のためでありますSmall航空機(そしてそれらはカテゴリです)では、マルチページGFの次のページは、ユーザーが選択した飛行機を表示するだけではありませんが、それはその上にポスト/航空機のおすすめ画像を表示します。したがって、選択された航空機に応じて画像が変わります。

GFでユーザーが選択した内容に応じて、その投稿IDのおすすめ画像をどのように取得できるのでしょうか?

UPDATE 6/24

[OK]をので、私はやっているものに、より明確にします。私は重力フォームを使用しています。航空機、特急、時間、アドオンなどを取得するためのフォームを作成するために、複数のページを使用しました。カスタムのポストタイプでフォームの航空機のページに入力する必要がありました。私はこれらの人口があるが、私は実際の入力の上に特集画像、航空機名、範囲などの投稿情報を表示する必要がありました。私はそれをして満足しましたが、フォームが提出されてフォームの次のページにナビゲートすると、投稿の画像を引っ張る必要がありました。

この場合、タイトルを表示する飛行機を選択しましたが、これに付随するおすすめ画像が必要でした。もともと、これはAJAX Gravity Formでなければなりませんでした。コンソールログをチェックしたときに画像が表示されず、未定義と表示されることもありました。jQueryを使用して情報を移動しているためです。

なぜ私はこのようにしているのでしょうか、これは私が選択したカスタム投稿タイプを表示する必要があった複数ページのGFでの最初の亀裂であるためです。

これで、画像が表示されていないので、航空機のフィルタリング可能なカテゴリを吐き出しているスクリプトが削除されているという考えがあったため、フォームのAJAXをオフにすることにしました。私は正しいのでAJAXをオフにして、イメージが表示されます。だから私の質問は、この特定のフォームのAJAXリクエストにこのスクリプトを含めるにはどうすればいいのですか?

以下この航空機が選択されると、特定のエリアに投稿画像を表示するためにjQueryを使用します。 var checkboxValue = $('#gform_page_6_1 input[type=checkbox]:checked').val(); var aircraftSelect = $('#membershipAircrafts').find('[data-aircraft-title="'+checkboxValue+'"]'); var aircraftImage = $(aircraftSelect).find('.membership-aircraft-image'); console.log(aircraftImage); $('.summary-image').html(aircraftImage);

今ここに私が削除されていたと思ったスクリプトです:

function ldm_add_membership_aircrafts() { 
    ?> 
    <script type="text/template" id="single-membership-listings"> 
     <% _.each(membershipAircrafts, function(membershipAircraft) { %> 
      <div id="aircraft<%= membershipAircraft.id %>" class="single-membership-inner clearfix col-sm-4" data-aircraft-title="<%= membershipAircraft.title %>"> 
       <% if(membershipAircraft.imageURL) { %> 
        <img class="membership-aircraft-image" src="<%= membershipAircraft.imageURL %>" alt="<%= membershipAircraft.title %>" /> 
        <div class="single-membership-content-container"> 
       <% } else { %> 
        <div class="single-membership-content-container"> 
       <% } %> 
        <div class="single-membership-title"><%= membershipAircraft.title %></div> 
        <div class="single-membership-range"> 
         <p id="membership-label">Range:</p> 
         <p id="membership-range-content"><%= membershipAircraft.range %></p> 
        </div> 
        <div class="single-membership-passengers"> 
         <p id="membership-label">Passengers:</p> 
         <p id="membership-passengers-content"><%= membershipAircraft.passengers %></p> 
        </div> 
        <div class="single-membership-baggage"> 
         <p id="membership-label">Luggage Capacity:</p> 
         <p id="membership-baggage-content"><%= membershipAircraft.baggage %></p> 
        </div> 
        <div class="single-membership-cabinDimensions"> 
         <p id="membership-label">Cabin Dimensions:</p> 
         <p id="membership-cabinDimensions-content"><%= membershipAircraft.cabinDimensions %></p> 
        </div> 
       </div> 
      </div> 
     <% }); %> 
    </script> 

    <script type="text/template" id="single-categories-listings"> 
     <% var categoryName; %> 
     <% var count = 0; %> 
     <div class="membership-categories-inner"> 
      <% _.each(membershipCategories, function(membershipCategory) { %> 
       <% if(count !== 0 && categoryName !== membershipCategory.taxonomy) { %> 
        </div> 
       <% } %> 
       <div data-term-id="<%= membershipCategory.id %>" class="single-membership-category <%= membershipCategory.termName %><% if(count === 0){ %> category-active <% } %>"><%= membershipCategory.termName %></div> 
       <% categoryName = membershipCategory.taxonomy; %> 
       <% count++; %> 
      <% }); %> 
       </div> 
     </div> 
    </script> 
    <?php 
} 

はそれについて考える、私はスクリプトが削除されているかわからないが、AJAXは実際に私が置いていますカスタムフィールドを削除しているが、

:部分と実際の入力ここ

echo '<li id="aircraft-tax" class="gfield">'; 
    echo '<div class="row">'; 
     echo '<div class="col-sm-12">'; 
      echo '<div id="membershipCategories" class="membership-categories"></div>'; 
     echo '</div>'; 
    echo '</div>'; 
echo '</li>'; 
echo '<li id="aircraft-content" class="gfield">'; 
echo '<div class="row">'; 
     echo '<div class="col-sm-10 col-sm-offset-1">'; 
      echo '<div id="membershipAircrafts" class="membership-aircrafts"></div>'; 
     echo '</div>'; 
    echo '</div>'; 
echo '</li>'; 

の上にそれらを追加するjQueryのを使用して、私は入力の上に置くために使用しているjQueryのです

$('#field_6_2').after($('#aircraft-tax')); 
$('#aircraft-tax').after($('#aircraft-content')); 

何をAJAXがこの情報を削除しないようにすることができますか?これをAJAXリクエストに含めることができれば、GFでAJAXをオフにした場合と同じように画像が表示されるように感じます。

**

UPDATE 3

**

私は私の問題を発見しました。私がGravity Formsでajaxを有効にすると、ページに最初にロードしたテンプレートが追加されていないことがわかります。たとえば、私は自分のページに含める部分があります: get_template_part('partials/membership-template', 'aircraft'); これは元々追加されていますが、次のフォームページに移動すると(これは複数ページのフォームなので)、このテンプレートはページが削除されます。

フォームを次のフォームページに移動した後、このテンプレートまたは部分的な部分を削除しないようにするにはどうすればよいですか?

答えて

0

あなたのフォームでは、(カスタム分類からの)飛行機のカテゴリを選択するユーザーがいるため、注目画像を表示するには実際の投稿を取得する必要があります。これをフォームページをレンダリングする場所に追加します。

$args = array(
    'posts_per_page' => 1, 
    'post_type' => 'ldm_build_card', 
    'ldm_build_card_categories' => 'large',//or selected type 
    'post_status' => 'publish' 
); 
$show_image = get_posts($args); 
if($show_image) { 
    get_the_post_thumbnail($show_image[0]->ID, 'image-size'); 
} 

UPDATE:ケースで私はあなたの質問を誤解: ポストIDはまたあなたのフォーム入力である必要がありそうget_the_post_thumbnail($entry[id-of-selection-field], 'image-size');いただいても、出力イメージ。

UPDATE 2: 別のページからデータを取得するには、pre_renderフィルタを使用し、2番目のページへのHTMLフィールドを追加します。

add_filter('gform_pre_render_{form_id}', 'populate_html'); 

次に、ページを取得するためにGFFormDisplayを使用しています。あなたの投稿IDを取得し、そこから画像を取得するフォームフィールドをループします。

function populate_html($form) { 
    //this is a 2-page form with the data from page one being displayed in an html field on page 2 
    $current_page = GFFormDisplay::get_current_page($form['id']); 
    $html_content = "The information you have submitted is as follows:<br/><ul>"; 
    if ($current_page == 2) { 
     foreach ($form['fields'] as &$field) { 
      //gather form data to save into html field (id 3 on my form), exclude page break 

       foreach ($field->inputs as $input) { 
        if ($input['id'] == {selected-plane-input}) { 
         $input_name = 'input_' . str_replace('.', '_', $input['id']); 
         $value = rgpost($input_name); 
         $html_content .= '<p>' . wp_get_attachment_url(get_post_thumbnail_id($value)). '</li>'; 
        } 
       } 

     } 
    } 
    foreach ($form['fields'] as &$field) { 
     if ($field->id == {your-html-field-id}) { 
       //set the field content to the html 
       $field->content = $html_content; 
      } 
    } 
    return $form; 
} 
+0

これがどのように動作して画像を表示するかはわかりません。重力の形の画像を実際に投稿する別のファイルがあります。これはjqueryの入力チェックボックスの上に追加しています。 私が再び取り組んでいる問題は、選択された航空機を搭載した複数ページのフォームの次のページにそのポストの特集画像を表示する必要があることです。選択されたものに基づいてそのサムネイルをどのように表示するかはわかりません。 –

+0

更新を参照してください。問題はちょうど2番目のページに情報を取得して表示していますか? – dg4220

+0

あなたの返答をありがとう、私はこれを前にしようとしていると私のためのイメージを取得していません。私が今やっていることは、html要素のIDから画像の位置を取得しようとしていることですが、次のページに移動すると要素が消えてから、定義されていません。 –

関連する問題