English 中文(简体)
How to fill the form when user clicks on a row without refreshing the page?
原标题:
  • 时间:2009-11-10 13:10:38
  •  标签:
  • php
  • html
  • ajax

I have a entry form. Below it, I want to show a grid containing existing records. As the user clicks on a row of the grid, the values must get filled in the fields of the form above.

Is there any way to do this without refreshing the page?

最佳回答

If all the info the form needs is already present on the page then AJAX would be overkill and simple Javascript would do the job perfectly. This isn t tested, but;

<form id="myform">
  <input id="name" type="text" ... />
</form>

<tr> 
   <td onclick="populateFormElement( myform ,  name , this);">Bob</td>
</tr>

in javascript;

function populateFormElement(formName, inputName, element)
{
   document.formName.inputName.value = element.firstChild.data;
}

This works on a single element but should be a reasonable starting point as the process is easy to adapt to whole rows. Simply put the onclick event on the tr element and step through the various children a bit more to extract the relevant data.

问题回答

Is there any way to do this without refreshing the page?

So, the key is asynchronous. The first A in Ajax stands for the very same word. You also tagged the question with Ajax. So I d expect that you have certain knowledge about that.

But the actual question doesn t require an ajaxical solution at all. You don t need to send and receive data from the server side at all, simply because all the needed data is already available inside the same HTML DOM tree.

The only feasible language which can access and traverse the HTML DOM tree at the client side is Javascript. It does not refresh the page at all. Just write code accordingly and execute it during the onclick event of the table row.

If you actually have a problem in writing the Javascript code accordingly, then you need to elaborate a bit more about it in your question. Do not ask "Is there any way?" --the answer is in 99.99% of the cases yes, but just ask "How do I do it?", supplied with relevant information about the coding you have as far.

Go get JQuery, and take a look at its AJAX functions. You will need to prepare the data in PHP, and create a special page to serve them. The AJAX function will be called when the user clicks on the button, it will load the data from the server, then it will parse them, and fill the grid...





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签