Jump to content

IPages Question


ucjohn

Recommended Posts

I'm using checkbox set for the below images under fields It's separated by a coma "," and i want to change the layout of it. Can someone guide me possibly on how to obtain this goal please.

Value.png.ed055b4e225aa25d1392cad9583d9ece.png

That's the current view I want it to list like

- Web Hosting

- Game Servers

- etc

 

Sincerely,

ucjohn

Link to comment
Share on other sites

Ok that worked beautiful as wanted.. But here is my code using said one you supplied above..

          <div class="ehch-server-card-grid">
            <div>
                      <div class="ipsDataItem_size1">
<div class="cont">
  <!-- Trigger the modal with a button -->
  {{if $fields['services'] ==''}}
  <a class="ipsButton ipsButton_medium ipsButton_important" disabled>Offered Services N/A</a>
 {{else}}
  <a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Offered Services</a>
  {{endif}}

  <!-- Game Server Provider -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- GSP content-->
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">Offered Services</h4>
        </div>
        <div class="modal-body">
          <dd class="coupon_text">
           {{foreach explode(',', $fields['services']) as $services}}
           - {$services}<br>
           {{endforeach}}
        </dd>
        </div>
        <div class="modal-footer">
          <a class='ipsButton_coupon' data-dismiss="modal"><i class="far fa-times-circle fa-2x"></i></a>
        </div>
      </div>
    </div>
  </div>
</div>
	</div>
              <div>
                <div class="key">Server Locations</div>
                <div class="value">{$fields['location']}</div>
              </div>
            </div>

<div>
  <div>
<div class="ipsDataItem_size2">
<div class="cont">
  <!-- Trigger the modal with a button -->
  {{if $gsp ==''}}
  <a class="ipsButton ipsButton_medium ipsButton_important" disabled>Game Servers N/A</a>
 {{else}}
  <a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Game Servers</a>
  {{endif}}

  <!-- Game Server Provider -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- GSP content-->
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">Game Servers</h4>
        </div>
        <div class="modal-body">
          <dd class="coupon_text">
             {{foreach explode(',', $fields['gsp']) as $gsp}}
           - {$gsp}<br>
           {{endforeach}}
        </dd>
        </div>
        <div class="modal-footer">
                       {{if $fields['order']}}
              <a class="ipsButton ipsButton_order" title="Order You're server Now" rel="nofollow" target="_blank" href="{$fields['order']}">Order Now</a>
             {{endif}}
          <a class='ipsButton_coupon' data-dismiss="modal"><i class="far fa-times-circle fa-2x"></i></a>
        </div>
        
      </div>
    </div>
  </div>
</div>
	</div>
  </div> </div> 

Buttons.png.019b73e229ed6111b04d49c35a16a83c.png

Cool so they're supposed to both display different information.. This is not the case both buttons feed back the same result..

 

services.thumb.png.45a2dc42a6941f84b1942ac321e30a55.png

But you sure resolved alot of my headache but I cannot seem to get past this last barrier.

Link to comment
Share on other sites

19 minutes ago, ucjohn said:

Cool so they're supposed to both display different information.. This is not the case both buttons feed back the same result..

You use identical selector myModal for both popups.

First popup

  <a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Offered Services</a>

and 

  <div class="modal fade" id="myModal" role="dialog">

Second popup

<a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Game Servers</a>

and 

<div class="modal fade" id="myModal" role="dialog">

Change one of them.

Better use original names like elOfferedServices, elGameServers

Link to comment
Share on other sites

5 hours ago, newbie LAC said:

You use identical selector myModal for both popups.

First popup


  <a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Offered Services</a>

and 


  <div class="modal fade" id="myModal" role="dialog">

Second popup


<a class="ipsButton ipsButton_medium ipsButton_important" data-toggle="modal" data-target="#myModal">Game Servers</a>

and 


<div class="modal fade" id="myModal" role="dialog">

Change one of them.

Better use original names like elOfferedServices, elGameServers

I knew I was missing something I should have known better thanks a bunch :) 

1 more small thing for game servers since there is a rather large list is there any possible way like after 5 or 10 games are listed inside the container it can possibly do this..

- Game1                                         - Game6

- Game2                                         - Game7

- Game3                                         - Game8

- Game4                                         - Game9

- Game5                                         - Game10

 

Cause if I list them all as one long list that's a ton of scrolling. If it's not possible that's ok.

Link to comment
Share on other sites

On 1/1/2018 at 11:26 PM, newbie LAC said:

One of examples


<div class='ipsColumns'>
	{{foreach array_chunk(explode(',', $fields['services']), 5) as $services}}
		<div class='ipsColumn ipsColumn_medium'>
		{{foreach $services as $service}}
			- {$service}<br>
		{{endforeach}}
		</div>
	{{endforeach}}
</div>

 

You Sir get a big cookie a Giant cookie and a award for being the best at IPB Pages.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...