I have a flask application that makes a call to my API to pull down some records. I then pass the json response to json2html, then to datatables to create a table. I plan on creating a button on my table with row select option.
My question is, can I use the data on my table to populate a form on another page? Effectively I want to be able to select the row, click update button which takes me to a form page with the form values populated from the row values. So if click row 1, and my form page with be populated,
id = 6a3d7026-43f3-67zt-9211-99dfc6fee82e
name = test
description = test
number = 20934120
....some other fields not from the table
I am not sure how I can achieve this without a database. Not looking for a full solution just some pointers on the best methods or some good documentation. Thanks
example response
{'count': 2, 'total': 2,
'data': [
{'id': '6a3d7026-43f3-67zt-9211-99dfc6fee82e',
'name': 'test',
'properties': {'Description#en': 'test', 'Number#en': '20934120'},
{'id': '6a3d7026-43f3-67zt-9211-99hdttbhh4ed',
'name': 'test',
'properties': {'Description#en': 'test', 'Number#en': '20934121'}}],
inside app.py
....REQUEST
response = requests.request("GET", url, headers=headers, data=payload)
data = json.loads(response.text)
output = json2html.convert(json = data, table_attributes="id=\"table1\" class=\"table1\")
return render_template("update.html", data=data, output=output)
inside update.html
{{output|safe}}
<script>
$(document).ready(function() {
$('#table1').DataTable( {
"searching": false,
dom: 'Bfrtip',
buttons: [
{
text: 'Update',
action: function ( e, dt, node, config ) {
alert( 'This is my button' );
}
}
]
} );
} );
</script>
Related
Hi I am creating order from other platform to wordpress. The customers that were subscribed offline but need to be put on woocommerce. but it is not full filling one thing in the column automatically.
The first row is created with api. it shows me the total amount of the order but i cannot find how will this field be populated. my code for created new order
billing_info = {
'first_name': row.firstName,
'last_name': row.lastName,
'email': row.email,
}
line_items = []
line_items.append(
{
'product_id': businessCreditProductId,
'quantity': 1,
'subtotal': row.amount,
'total': row.amount,
'price': float(row.amount),
})
wcapi.post('orders', data={
'customer_id': userId,
'line_items': line_items,
'status': 'completed',
'billing': billing_info,
})
i need to reflect the credit applied sublist data in my printout suitelet
but when i get the line count for credit line( var itemCount_credit = billPayRec.getLineCount({ 'sublistId': 'credit' }); ), system logs line count as -1.
Is there any way to fetch this data and if its possible from search than any suggestion what filters / columns woul i require to include?
Unless you are able to intercept the request, no. They keep this information obfuscated and by the time it has reached the sublist, it's just cached data. You could get some of the field data with inspect element but likely only what you can see.
Since you are using a Suitelet you can extract the credits applied as follows. This was run in the console but the core of it would work in a SS2.1 script. Convert ()=>{ functions to function(){ for SS2.0
require(['N/search'], search=>{
const appys = [];
search.create({
type:'vendorbill',
filters: [
[ 'internalid', 'is', 'your vendor bill internalid']
],
columns:[
'tranid',
'applyinglinkamount',
'applyinglinktype',
'applyingtransaction'
]
}).run().each(ref=>{
if(ref.getValue({name:'applyingtransaction'})) appys.push(ref.getValue({name:'applyingtransaction'}));
const c = ref.columns;
c.forEach(c=>{
const v = ref.getValue(c);
if(!v) return;
console.log(c.name, v);
});
console.log('');
return true;
});
search.create({
type:'transaction', // or just vendorcredit for you original question
filters:[
['internalid', 'anyof', appys], 'AND',
['mainline', 'is', 'T']
],
columns:['tranid'] // plus any columns of interest.
}).run().each(ref=>{
// if filtering type:'transaction' you'll get a mix of vendorcredit, vendorpayment, journalentry
console.log(ref.recordType, ref.getValue({name:'tranid'}));
return true;
});
});
Wha is the best way to hide empty or null comumns from Yajra Datatables:
var table = $('.data-table').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('any.route') }}",
columns: [
// How to Hide any of these columns if its data is empty or null?
// for exampe I want to hide mname column ?
// visible: what condition for example !!!!
{data: 'fname', name: 'fname'},
{data: 'mname', name: 'mname'},
{data: 'lname', name: 'lname'},
....
]
});
How do I hide th in table whenever any data is empty or null. for instance, using visible:, what condition should I use to test if the data: is empty or null
Can I see your controller? I have same issue but I can fix it
Try this in your controller!
public function example(){
if ($request->ajax()) { // if request ajax
$data = User::all(); // take all user table
return Datatables::of($data)
->editColumn('fname', function ($row) { //this example for edit your columns if colums is empty
$fname = !empty($row->name) ? $row->name : 'empty';
return $fname;
})
->make(true);
return view('example', compact('data'));
}}
This is the best way to hide NULL values from the data tables.
$('#leads').DataTable({
"columnDefs": [{
"defaultContent": "-",
"targets": "_all"
}]
I am trying to create a table for my website and for some reason it is only showing the first row of data.
This is how I am formatting the columns of the data:
const { items } = this.props.item;
// console.log({ items });
// react - bootstrap - table - next
const columns = [{
dataField: 'team',
text: 'Team',
sort: true,
formatter: (cellContent, row, rowIndex) => (
Object.values(row.team)[rowIndex]
)
}, {
dataField: 'current_Rank',
text: 'Current Rank',
sort: true,
formatter: (cellContent, row, rowIndex) => (
Object.values(row.current_Rank)[rowIndex]
)
}, {
dataField: 'new_Rank',
text: '321 Rank',
sort: true,
formatter: (cellContent, row, rowIndex) => (
Object.values(row.new_Rank)[rowIndex]
)
}];
This is how I am returning the table so that it renders the table:
return (
<BootstrapTable
keyField="team"
data={items}
columns={columns}
striped
hover />
)
}
}
The data:
Picture from the console
Live site: https://nhl-321-pointsystem.herokuapp.com/
I looked up your network response for /api/items API call, and found out that the data contains only one item. This being one of the reason you're seeing a single row when the table is rendered.
Please note the, another reason for the issue is, react-bootstrap-table-next key
data accepts a single Array object. And not array of single object.
You should re-arrange your data so that key 'team' will be present for all items in the array. And rest of the column header values (e.g. current_Rank) are available for each like.
Something like a reformat function I created in the sandbox available here.
Plus point - After you apply the reformat function, you won't need formatter for each column unlike your previous solution.
Alternate but recommended solution would be to send the formatted response from the API endpoint only, instead of re-parsing and creating new object to fit the needs of UI.
Sandbox link - https://codesandbox.io/embed/32vl4x4oj6
Hi guys
I am try to research Yahoo lib- grid. I created a button to display grid. But when i click button N times -> it is displayed N grids. I only want display one grid and after click button it will get data from server again. My code like below:
Please help me., Thank you.
YUI({ filter: 'raw' }).use("jsonp", "node",function (Y) {
function handleJSONP(response) {
// Y.one("#out").setContent(Y.Lang.sub(template, response.user));
YUI().use("datatable-base", function(Y) {
var cols = [
{ key: "id", label: "Transaction No", abbr: "id"},
{ key: "userName", label: "User Name", abbr: "userName"},
{ key: "storeName", label: "StoreName", abbr: "storeName"}
],
data = response.Root,
dt = new Y.DataTable.Base({
columnset: cols,
recordset: data,
summary: "Price sheet for inventory parts",
caption: "These columns have labels and abbrs"
}).render("#example");
});
}
Y.one("#demo_btn").on("click", function (e) {
var url = "server.jsp"+ "?callback={callback}";
Y.jsonp(url, handleJSONP);
});
});
You should be using the DataSource utility to retrieve the data via JSONP. This will allow you to then reload the data via something like
dt.datasource.load();
See the docs for details: DataTable + DataSource.Get + JSON Data
Your handler needs to check if you've already created the table.
var dt;
if (dt === null) {
dt = new Y.DataTable.Base // etc.
}