Hi all,
I got a grid that display all products/items with specific unit price for each customer (login user = customer).
I need to add a column to the end of grid where to insert a quantity value. Being a grid I think it’s not possible.
Then based on two icons ‘Order’ or ‘RFQ’ I’ve to take that quantity and insert/update data in other connected tables.
How can I achieve this ? Is there any workaround ?
In a standard grid you cannot add fields. If you need that then you need to create a multiple record form.
Hi Albert,
As you suggested , I’m using a form editable gridview. I added to table the Quantity field but only for make an input.
Now I got several rows where the only updatable field is Quantity (column) .
Once the user insert the quantity of that specific item line, later, I want to use two icons fields and OnClick event to trasfert that quantity to another table.
Becouse the table is like a item catalogs I want to inhibit the possibility to use the two Icons in front of every row (update arrows, delete bin).
How can I hide them ?? Need I to create a new theme… or something like that… ;-(
Do you think that form works the same… without the two initial icons ??
Thanks
Hi, giovannino,
here is a live example of SC form (editable grid) where you can edit quantity.
as you can see there is no icons on the left side of each row only the input.
I have to use a form… editable grid instead … ;-(
Hi Hiran, thank for support.
It seems that only possible solution is about using a form editable grid disabling all field but the Quantity field.
Quantity is a fictious field added to Products table (item catalogue) in order to have an input field.
The Htlm image are then linked to a blank application that run the insert/update code to another table (i.e. insert/update Orders_details table or RFQs_details table).
In your sample it seems that you update your same table or delete the row (I suppose but I’m not sure)
Lets look to my image… no alternative ways at the moment.
Do you know how hide initial icons of the form ?? I mean deleting bin and update arrows ? I can leave to user to delete a row becouse it’s a catalogue item row…
It has to remain for all other user that maybe would like to order that item…
Hi Giovannino,
Hi Hiram, thanks.
If you use a grid you can’t have an input field like Quantity within others. Grid only display as default. That’s why I needed to change to form.
About rows you can add almost all fields type but when you have to use OnClick Ajax events only some of them works (i.e. Html image not works) .
The only way to add code to a Htlm Image is to redir it after click with link to a blank application, run the code and then come back to form again… ;-(
The ugly thing is that all screen become white for a while (becouse of linked blank application running ) and then it comes back to form.
Is there a way to run the code without seeing the White page screen ??
Bye
[SIZE=5]How to add input fields on a Grid [/SIZE]
You can do things Out of SC box,
For example add input fields on a grid just:
echo “<input type=‘text’>”;
add javascript event onChange just
echo “<input type=‘text’ onchange=‘alert(this.value)’>”;
also can use AJAX to update values on the fly.
If you need your field with a spin control just add:
[B]<input type=‘number’>
[/B]If you need a minimun and max
<input type=“number” min=“10” max=“20” >
If you need to start with a number and specify increments of the spin control
<input type=“number” min=“10” max=“20” step=“2” value=“16” >
SC its a platform that can help you on most of time
but some cases you need to do things out of the box to fit your project needs.
Here is an example: http://jsfiddle.net/juj4pufv/1/
[SIZE=5]How to add input fields on a Grid using SC and call a javascript function[/SIZE]
In this example we are going to call a javascript funcion when user write a value on the custom field
First add a Text field with Show HTML content OFF and name it col on your Grid App then add OnRecord:
{col}= “<input type=‘text’ onkeyup=‘myfunction({id},this.value)’>”;
Note: {id} must be your table id field, so you can identify the new quantity value for that id
onHeader of your grid write thiscode:
echo '<script>
function [B]myfunction[/B](id,quantity){
alert("ID:"+id + " and quantity:"+quantity); // place your CUSTOM CODE HERE
}
</script>';
On this step you must place your custom JAVASCRIPT code, and thats all now you know the ID and the new quantity.
============================================
Assuming that you know about how to implement AJAX, just replace the code to send that ID and quantity to a PHP file or SC blank app
echo '<script>
function [B]myfunction[/B](id,quantity){
$.post( "yourFile.php", { "id": id, "quantity": quantity })
.done([B]function[/B]( data ) {
alert( "Response of yourFile.php: " + data );
});
}
</script>';
Replace yourFile.php with the real URL of your PHP file ( or SC blank app).
On yourFile.php you can use $_POST[‘id’] to get the ID and $_POST[‘quantity’] to get the quantity and run a MySQL query to update a table
Hi Hiram, thanks
I implement first part of your suggestion and it seems it can work.
On second part when you say “you can also add javascript event onChange for example:” I got a problem becouse the only available selection given is only OnClick.
Is it only an alternative or I need also implement it ?
When you say “also can use AJAX to update values on the fly.” what do you mean ?
Have you got a sintax sample just to understand how write it ?
Hi Hiram,
Now I got this within OnRecord code.
{Quantity}="<input type=‘text’ size=‘6’>"; If I’m not wrong this show only the field as data input . If I do echo {Quantity} I see only the field as rectangle not the value on it.
I need to have the possibility to use the value that user insert into it on data entry.
How can I do ? The only option open on Ajax Events is “OnClick” , but I insert a value I don’t click it. The OnChange it could be nice but it’s not available.
When I used the form I did something like that within Quantity_onChange (that was open on dd list).
[glo_Quantity_row]={Quantity};
in order to have later the possibility to use the Quantity value in othen applications called.
When I later do the insert on mysql DB I need to have quantity value available as global variable.
Many thanks
[SIZE=5]How to add input fields on a Grid using SC and call a javascript function[/SIZE]
In this example we are going to call a javascript funcion when user write a value on the custom field
First add a Text field with Show HTML content OFF and name it col on your Grid App then add OnRecord:
{col}= “<input type=‘text’ onkeyup=‘myfunction({id},this.value)’>”;
Note: {id} must be your table id field, so you can identify the new quantity value for that id
onHeader of your grid write thiscode:
echo '<script>
function [B]myfunction[/B](id,quantity){
alert("ID:"+id + " and quantity:"+quantity); // place your CUSTOM CODE HERE
}
</script>';
On this step you must place your custom JAVASCRIPT code, and thats all now you know the ID and the new quantity.
============================================
Assuming that you know about how to implement AJAX, just replace the code to send that ID and quantity to a PHP file or SC blank app
echo '<script>
function [B]myfunction[/B](id,quantity){
$.post( "yourFile.php", { "id": id, "quantity": quantity })
.done([B]function[/B]( data ) {
alert( "Response of yourFile.php: " + data );
});
}
</script>';
Replace yourFile.php with the real URL of your PHP file ( or SC blank app).
On yourFile.php you can use $_POST[‘id’] to get the ID and $_POST[‘quantity’] to get the quantity and run a MySQL query to update a table
Ok Thanks.
I did first part but I did change ‘onkeyup’ with ‘onchange’ becouse when I started to write the quantity value, it popup eveytime suddenly. I hope it could be ok the same.
I used ProductID instead of id becouse I got it . It’s a text field . I hope that is not a problem but as you can see on attached images I got some problems on header alert message.
Then onHeader I inserted the code as you suggested.
Now the last part is not clear to me.
That code has to be placed on Header too or into OnRecord . I got a blank code application I used on form to make the insert of the row values and quantity on mysql table “products_selected”.
When I did it I got all global variables coming from the link connected to image icon “Order” . I suppose I have to map them all too here.
Unfortunately I’m not a programmer and so it’s almost complicated for me… to understand all steps ;-(
if you are going to use ajax you must use the code of step 3 onHeader. (The code on step 2 is just an example to see the values)
The code on step 3 send two values to another URL you need to do something with that values like run a SQL query.
On step1 i got : {col}= “<input type=‘text’ size=‘6’ onchange=‘myfunction({ProductID},this.value)’>”;
the alert later give me a wrong value for {ProductID} . I also try to use ‘{ProductID}’ between quotes but it give an error. SEE IMAGE
Why alert work only on first row and then, on other rows, not ??
echo ‘<script>
function myfunction(id,quantity){
alert("ID: "+id + " and quantity: "+quantity); // place your CUSTOM CODE HERE
}
</script>’;
If I have 7/8 parameters to pass to blank application where I have to add them ?
This is the blank with all glo_variables I need to record the row into table. ProductID and Quantity are some of them.
[order_date] = date(‘Y-m-d’);
$sql_insert_selected = "
INSERT products_selected
(ProductID, CustomerID, ProductName, SupplierID, CategoryID, CompanyID, SelectedDate, Quantity, UnitPrice , ProductID_altern)
VALUES
(’[glo_ProductID]’, ‘[glo_CustomerID]’, ‘[glo_ProductName]’, ‘[glo_SupplierID]’ ,
‘[glo_CategoryID]’, ‘[glo_CompanyID]’, ‘[order_date]’ , [glo_Quantity_row], [glo_UnitPrice], ‘’)
ON DUPLICATE KEY UPDATE Quantity = Quantity + [glo_Quantity_row]";
sc_exec_sql( $sql_insert_selected );
sc_redir(hhh_grid_products_for_order, “”, “_parent”);
If your ProducID is not numeric needs be in quotes like this:
{col}= "<input type='text' size='6' onchange='myfunction([B]\"{ProductID}\"[/B],this.value)'>";
If you need to send more parameters then, just add a comma inside the function and ,"{VAR1}"
{col}= "<input type='text' size='6' onchange='myfunction(\"{ProductID}\",this.value[B],[/B][B]\"{VAR1}\"[/B])'>";
Then change your javascript function for each extra parameter
echo '<script>
function myfunction(id,quantity[B],var1[/B]){
alert("ID: "+id + " and quantity: "+quantity [B]+"var1:"+var1[/B]); // place your CUSTOM CODE HERE
}
</script>';
Please note that this javascript code only shows the values dont send any data to your Blank app
Hi Hiram,
thanks so much.
At the end … something is running quite fine.
This is the two part of code I used. I leave here also as sample for other people that do not chew so much coding like me … 
Showing your hints to a programmer he give me some additional lines. I don’t know if they all are needed but now it works.
OnRecord
if (isset($_POST[‘id’])){
[glo_ProductID] = $_POST[‘id’];
}
if (isset($_POST[‘name’])){
[glo_ProductName] = $_POST[‘name’];
}
if (isset($_POST[‘supplier’])){
[glo_SupplierID] = $_POST[‘supplier’];
}
if (isset($_POST[‘category’])){
[glo_CategoryID] = $_POST[‘category’];
}
if (isset($_POST[‘company’])){
[glo_CompanyID] = $_POST[‘company’];
}
if (isset($_POST[‘price’])){
[glo_UnitPrice] = $_POST[‘price’];
}
if (isset($_POST[‘quantity’])){
[glo_QuantityRow] = $_POST[‘quantity’];
}
{col}= “<input type=‘text’ size=‘6’ onchange='myfunction(”{ProductID}","{ProductName}","{SupplierID}","{CategoryID}","{CompanyID}","{UnitPrice}", this.value)’>";
OnHeader
echo '<script>
function myfunction(id, name, supplier, category, company, price, quantity){
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
console.log(xmlhttp.responseText);
}
}
xmlhttp.open(“POST”,location.href,true);
xmlhttp.setRequestHeader(“Content-type”,“application/x-www-form-urlencoded”);
xmlhttp.send(“id=”+id+"&name="+name+"&supplier="+supplier+"&category="+category+"&company="+company+"&price="+price+"&quantity="+quantity.toString());
</script>’;
Additional question
If (price <= 0) { alert(“Attention Only item with price are accepted…”); }
Many thanks again !!!
Hi Hiram,
I got some problems becouse my ignorance about JS.
When you say "Please note that this javascript code only shows the values dont send any data to your Blank app " .
This is probably my problem.
I’m using the code I posted here and everything works BUT the quantity field that is always empty.
Using console the value of quantity is correct but when I use
if (isset($_POST[‘quantity’])){
[glo_QuantityRow] = $_POST[‘quantity’];
}
the global variable is always empty.
I’m really stucked here and I don’t really what can fix this problem.
Thanks
I have to agree with Albert.
Although you can make it work with grid, you should remake your app as a form, You can quickly replicate this behavior as a form, except for the refined search, but you may have a normal filter / search in there.
Do what you want inside a grid can be done, but its tricky.