Jump to content

foreach wont display results on modal?


Recommended Posts

am trying to make contact form inside modal but for some reason it just wont work. records are displaying ok but when i click on the modal link information only about the first record displays no matter whichever other records i click in

 

 foreach ($result as $row) {
        
        echo '<br/>
        <h3>'.$row['title'].'</h3>
        <div class="highLight">
        <p><b>'.$row['name'].'</b>
        <br/>
        <small>
        <b>Posted:</b> '.time_difference($row['created']).'
        </small>
        <br/>
        '.$desc.'
        </p>
        <a href="#contactNow" class="contactnowBtn"/>Contact Now</a>
        </div>';
        
        /*Load info to Modal*/
        
        echo '<div id="contactNow">
        <div class="contactNow-content">
        <div class="header">
        <h2>'.$row['title'].' - '.$row['id'].' </h2>
        <p><b>'.$row['email'].'</b></p>
        </div>
        <div class="contact_modal_body">
        <a href="#"> Close </a>
        </div>
        </div>
        <div class="overlay"></div>
        </div>';
    }
}
 

Link to post
Share on other sites

What is this modal link thing you speak of? What is $desc? What is $result?

$desc is description and result is from the mysql  query. everything is working just ok just that am unable to load the results into the modal only the first result info gets inside the modal regardless clicking on other records contact

Link to post
Share on other sites

AGAIN - what is this modal thing?

well when i click on  <a href="#contactNow" class="contactnowBtn"/>Contact Now</a> a window opens up within the page and thats where i wish to add my contact form according to the records fetched from db

Link to post
Share on other sites

lol i did ok here is the modal part its css based

 

 

        

       <div id="contactNow">
        <div class="contactNow-content">
        <div class="header">

        <h2>Modal</h2>

        <p><b>Post Info</b></p>

        </div>

        <div class="contact_modal_body">

        <a href="#"> Close </a>

        </div>

        </div>

        <div class="overlay"></div>

        </div>

 

and this is the php code which fetches all the records

 

foreach ($result as $row) {

        

        echo '<br/>

        <h3>'.$row['title'].'</h3>

        <div class="highLight">

        <p><b>'.$row['name'].'</b>

        <br/>

        <small>

        <b>Posted:</b> '.time_difference($row['created']).'

        </small>

        <br/>

        '.$desc.'

        </p>

        <a href="#contactNow" class="contactnowBtn"/>Contact Now</a> /// this is the link which opens up the modal window

        </div>';
}

Link to post
Share on other sites

Not even close. Sit back - think about your problem and if you don't realize something think about what might be wrong and show us the essential part(s) of that so we can follow the process. Not bits and pieces and no names nor relationships.

  • Like 1
Link to post
Share on other sites

Not even close. Sit back - think about your problem and if you don't realize something think about what might be wrong and show us the essential part(s) of that so we can follow the process. Not bits and pieces and no names nor relationships.

you are right im the one not clear myself what exactly im trying to do. working on it again not getting the idea how to pass the idetails to that window of maybe il think of something easier than this i guess. still appreciate you have given me ur valuable time

Link to post
Share on other sites

Taking a guess at what you want to do.

 

Your anchor is calling a js function. That function s/b opening the modal window and calling a separate php script that populates it for you and goes away, leaving another script in the form tag of the modal window.

Link to post
Share on other sites

Taking a guess at what you want to do.

 

Your anchor is calling a js function. That function s/b opening the modal window and calling a separate php script that populates it for you and goes away, leaving another script in the form tag of the modal window.

no no this modal is complete css based when click on #contachNow the window opens up wait ill post the code how this modal works

Link to post
Share on other sites

everything opens within the same page no external file is called and i tried to add this inside the foreach so that i could add post information straight away but it just wont happen

 

this is the css part

#filterSearch {
  left: 45%;
  margin: -230px 0 0 -32%;
  opacity: 0;
  position: absolute;
  top: -50%;
  visibility: hidden;
  width: 75%;
  box-shadow: 0 3px 7px rgba(0,0,0,.25);
  box-sizing: border-box;
  transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -webkit-transition: all .4s ease-in-out;
}
#filterSearch:target {
  opacity: 1;
  top: 50%;
  visibility: visible;
}
#filterSearch .header, #filterSearch .footer {
  border-bottom: 1px solid #428BCA;
  border-radius: 5px 5px 0 0;
}
#filterSearch .footer {
  border: none;
  border-top: 1px solid #e7e7e7;
  border-radius: 0 0 5px 5px;
}
#filterSearch h2 {
background:#fff;
  margin: 0;
  color: #000;
  padding:4px 4px;
  font-weight:bold;
  font-size:16px;
}
#filterSearch .btn { float: right
}
#filterSearch .modal_body, #filterSearch .header, #filterSearch .footer {
  padding: 10px;
  color: #000;
}
.filterSearch-content {
  background: #fff;
  position: relative;
  z-index: 20;
  border-radius: 5px;
  color: #fff;
}
#filterSearch .modal_body { background: #fff
}
#filterSearch .overlay {
  background-color: #000;
  background: rgba(0,0,0,.;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10;
}
.filter_search a{
background: url("../images/filter.png") no-repeat left;
color: #fff;
font-weight: bolder;
font-size:11px;
margin:1%;
padding:27px;
}
.modal_body a {
  color: #ff0000;
  text-decoration: none;
  display: inline-block;
  padding: 5px 10px;
  border-radius: 5px;
}

now the html

<div id="filterSearch">
  <div class="filterSearch-content">
    <div class="header">
      <h2>FILTER SEARCH:</h2>
    </div>
    <div class="modal_body">
 
 
<p>Anything you write here</p>
 
<a href="#"> Close </a>
       </div>
</div>
  <div class="overlay"></div>
</div>
Edited by lovephp
Link to post
Share on other sites

I think the issue here is really just coming from a lack of understanding the capabilities of the processes you are working with.  

 

The following is a basic representation of the processing when using a web browser:

 

Step 01 > Server gets an http request from client

Step 02 > Server runs php using any header information passed in the http request

Step 02.1 > Server connect to backend storage

Step 02.2 > Server retrieves data from backend storage

Step 02.3 > Server processes data from backend storage

Step 03 > Server finishes running php and buffers result

Step 04 > Server returns result of php script to requesting client.

--------------

Step 05 > Client receives the result from the server into buffer

Step 06 > Client browser processes the header information in the server response

Step 07 > Client browser processes client side scripting (such as javascript) stored in the header

Step 08 > Client browser applies css styles to buffered page content

Step 09 > Client browser renders page content to screen

Step 10 > Client browser processes client side scripting in the page body

Step 11 > Client Browser allows interaction with the page in the browser

---------------

Step 11 > Client browser submits user data to server in form of http request

Step 12 > GOTO Step 01

 

The first break is where the server relinquishes the data to the client - at this point php will no longer run.  Thus all data the php needs to work with will need to be present BEFORE this happens.

The second break is where the client would send data back to the server, all relevant data from the page that is required to go to the server must be included in the http header at this time or the server will not know anything about it.

 

While some basic visual effects can be "programmed" into CSS, complex manipulation of DOM elements requires something a little more suited to the task.

 

To debug the problems you are having you will need to follow your data on it's way though the process above and see at which point it's getting lost.  Then you will know what side of things you need to look at: server->transport->client.

  • Like 1
Link to post
Share on other sites

I think the issue here is really just coming from a lack of understanding the capabilities of the processes you are working with.  

 

The following is a basic representation of the processing when using a web browser:

 

Step 01 > Server gets an http request from client

Step 02 > Server runs php using any header information passed in the http request

Step 02.1 > Server connect to backend storage

Step 02.2 > Server retrieves data from backend storage

Step 02.3 > Server processes data from backend storage

Step 03 > Server finishes running php and buffers result

Step 04 > Server returns result of php script to requesting client.

--------------

Step 05 > Client receives the result from the server into buffer

Step 06 > Client browser processes the header information in the server response

Step 07 > Client browser processes client side scripting (such as javascript) stored in the header

Step 08 > Client browser applies css styles to buffered page content

Step 09 > Client browser renders page content to screen

Step 10 > Client browser processes client side scripting in the page body

Step 11 > Client Browser allows interaction with the page in the browser

---------------

Step 11 > Client browser submits user data to server in form of http request

Step 12 > GOTO Step 01

 

The first break is where the server relinquishes the data to the client - at this point php will no longer run.  Thus all data the php needs to work with will need to be present BEFORE this happens.

The second break is where the client would send data back to the server, all relevant data from the page that is required to go to the server must be included in the http header at this time or the server will not know anything about it.

 

While some basic visual effects can be "programmed" into CSS, complex manipulation of DOM elements requires something a little more suited to the task.

 

To debug the problems you are having you will need to follow your data on it's way though the process above and see at which point it's getting lost.  Then you will know what side of things you need to look at: server->transport->client.

Really appreciate it for this explanation.

Link to post
Share on other sites
This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

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.