DXBLouie
Posts: 21
|
| Posted: 06/02/2011, 5:38 AM |
|
Well it took me a while but i finally got this working
perhaps it'll help some of you who are looking for a similar functionality, or some of the features i got working.
i've implemented this for an invoice entry form, where the main invoice body is entered through an editable grid
you have part number, description, quantity, price and total price
i wanted to set it up with auto-fill, so the user keys in the part-number, and the description and price are automatically filled from the DB.
now this is generally simple, you just need to add the auto-fill feature, however in many cases the data-entry user doesn't have the part-number memorized, and typically there are hundreds, if not thousands of parts, so a lookup search grid would come in handy, as long as there was a way to popup the lookup grid, search, find the part, click the part you need and have the part number automatically filled on the master form (on the appropriate grid row) and have the ajax auto-fill feature kick in then to fill the rest of the fields.
so first of all, to get the popup window, i added a column to the editable grid, and i put a link control (basically a magnifying lens icon) with an OnClick set as
OpenPop_UpList({invoice_detail:rowNumber}); return false;
now in the top of the HTML, i added the following custom script:
function OpenPop_UpList(rowNumber)
{
var linkhref = document.getElementById("invoice_detailLink1_"+rowNumber).href;
var win=window.open(linkhref+"?row="+rowNumber, "invoice_detailLink1_"+rowNumber, "left=100,top=10,width=640,height=480,status=no,toolbar=no,menubar=no,location=no,scrollbars=yes");
win.focus();
}
as you can see, when the editable grid is populated, each search button has the row number embedded in the onclick script call, and the function reads the value, and embeds it in the target URL parameter of the search grid popup (i.e: search_popup.php?row=1 )
the search grid popup is a simple grid with a search form on top..
i changed the part_number column from a label to a link, and the link has an OnClick event set as SetOpenerValue(this);return false;
and within the HTML, i added the following functions, first a function to retrieve the row number from the URL (you can probably simplify this, but i wanted something generic that i can use elsewhere too)
function getParameter(name) {
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}
and the actual function that returns the clicked row value back to the master form
function SetOpenerValue(currentObj)
{
var rowNumber = getParameter('row');
var target_cell = "item_pn_"+rowNumber;
var IE = (document.all) ? 1 : 0;
if(IE) {
var PartNum = currentObj.innerText;
} else {
var PartNum = currentObj.text;
}
window.opener.document.invoice_detail[target_cell].value = PartNum;
//HACK: invoke ajax call directly to fill the fields
window.opener.invoice_detailitem_pnPTAutoFill1_start(window.opener.document.invoice_detail[target_cell]);
window.opener.focus();
window.close();
}
notice in the code above, under the HACK remark, the following line invokes an Ajax call on the parent form to trigger the auto-fill feature.
this way when the part number field on the main editable grid is filled via the search popup, ajax-autofill would also fill the description/price fields just like with normal entry
hope this helps!
|
