JavaScript - how to insert a hyperlink with dynamic label into a datatable - hyperlink

I followed the example on this link https://datatables.net/reference/option/columns.render and was able to insert the hyperlink into the table. However, I could not make the label of the hyperlink dynamic. Here is my code:
render: function (data, type, row) {
var chipName = data.substring(data.length-6, data.length-1);
return 'chipName';
}
As you can see, I defined chipName as a variable and its value is from the data. However, with this code, the label for the hyperlink is always "chipName" instead of "ABB109", "ABB110" as expected.
Please help

That's because you are not concatenating chipName variable with the string.
The right code:
...
return '' + chipName + '';
...

Related

How to embed html in Google Forms question's description

I am trying to adapt Zack Akil's script to generate a Google Form from a Google Sheet using App Script, but one thing that I am struggling with is to make the sheet's input parsed as HTML. I generate a form based on my sheet, all the text on cells is placed in Forms as plain text, the HTML is not parsed (see figure below).
I pasted the script from Zack and I kindly ask you to point out where should I modify in order to have this parsed on the form.
function getSpreadsheetData(sheetName) {
// Return an list of objects (one for each row) containing the sheets data.
var arrayOfArrays = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(sheetName || 'Sheet1').getDataRange().getValues();
var headers = arrayOfArrays.shift();
return arrayOfArrays.map(function (row) {
return row.reduce(function (memo, value, index) {
if (value) {
memo[headers[index]] = value;
}
return memo;
}, {});
});
}
function create_ranges_for_data(form, data, data_section_name){
// loop throughh each row
data.forEach(function (row) {
// create a new question page
form.addPageBreakItem()
// add page title
form.addSectionHeaderItem()
.setTitle(data_section_name);
// create number range input with the title being the document to be labeled
form.addScaleItem()
.setTitle(row[data_section_name])
.setBounds(1, 10)
.setRequired(true);
});
}
function make_form_using_column(column_name) {
// create a new Google Form document
var form = FormApp.create('Data labelling - ' + column_name)
desc = "Thank you for taking the time to label this data!";
form.setDescription(desc);
form.setProgressBar(true);
form.setShowLinkToRespondAgain(false)
var data = getSpreadsheetData();
create_ranges_for_data(form, data, column_name);
}
function gen_form(){
var COLUMN_TO_USE = 'Input text'
make_form_using_column(COLUMN_TO_USE);
}
You can't use HTML text formatting. most sites block it because it poses a security risk. You might need to install an add-on or, like fullfine said, use bold text.

How to extract the "href" attribute of <a> and paste it in a Google sheet?

I would like to extract an HTML anchor's ( < a href="" >Link here< /a > ) "href" attribute from the following page:
https://tvm.liga.nu/cgi-bin/WebObjects/nuLigaTENDE.woa/wa/teamPortrait?team=2368692&championship=K%C3%B6ln-Leverkusen+Winter+2019%2F2020&group=18
and put it in my google sheet.
I tried several xpath expressions for this page but it is everytime "N/A".
Still the simple xpath doesn't work, e.g.
importxml("https://tvm.liga.nu/cgi-bin/WebObjects/nuLigaTENDE.woa/wa/teamPortrait?team=2368692&championship=K%C3%B6ln-Leverkusen+Winter+2019%2F2020&group=18";"//tr")
What am I doing wrong?
Thanks Tanaike for all of your efforts.
I changed the script a little bit, because the result is based on pure html and needs to be changed so that the link could be clicked.
function getWebsite(url, searchText, baseURL)
{
var html = UrlFetchApp.fetch(url);
var text = html.getContentText();
var re = new RegExp('(?<=<a href=")(.*)(?=">.*' + searchText +')',"g");
var link = text.match(re)[0];
if (link !== null)
{
var link = text.match(re);
link = link.replace(/&/g,"&");
link = link.replace(/"/g,"\"");
return baseURL + link;
}
else { return "not found"; }
}
It depends which information you're looking for, but for example...
A1: https://tvm.liga.nu/cgi-bin/WebObjects/nuLigaTENDE.woa/wa/teamPortrait?team=2368692&championship=K%C3%B6ln-Leverkusen+Winter+2019%2F2020&group=18
A2: //table[2]/tbody/tr/td[6]/a/#href
A3: =IMPORTXML(A1,A2,1)
To find A2 - in Chrome - right-click a link of interest and "Inspect." Right-click on the href of interest to you, and "Copy full XPath."
Delete the part before the table reference, but leave TWO "/"s before the table reference. Then, delete the reference to the specific row following "tr", i.e., the "[x]". This way you'll select the entire column - in this case "[6]"
Fiddle as necessary.

AG Grid / Angular 6 - trying to render a hyperlink with two columns

I'm trying to do this in my AG Grid (Angular 6):
have a column that shows the name of my object
but at the same time, that column should render this as a hyperlink to an edit page, using the Id of that object (not the name)
My current code snippet:
columnDefs = [
{
headerName: 'Name', field: 'Name', width: 125,
cellRenderer: function(params) {
return '' + params.value + '';
}
},
However, right now, all I can do is create a cell renderer, but since it's the cell renderer for the column of the Name column, I can only access that name - but I need the Id to build the hyperlink, which should point to /admin/edit/47 (or whatever the Id might be).
How can I accomplish this? What more do I need to do in order to be able to get both the Name (for display) as well as the Id in my cell renderer?
You can access it using params.data.Id where params.data points to your object bound to your record. So,
cellRenderer: function(params) {
return '' + params.value + '';
}
will give you the result you are expecting.

how to pass value of hidden column as extra parameter to editurl in jqgrid

i have a hidden column in my grid. i want to pass the value of this column to my editurl when i want to add a new row. I tried using
onclickSubmit: function (options, postdata) {
var rowid = postdata[this.id + "_id"];
var dataF = jQuery('#list').jqGrid ('getCell', rowid, 'account');
return {account:dataF};
}
inside the add options of navgrid but this passes NULL value !
please help
thanks.

How to display previous value on Min Miles text field

I want to display a previous value on Min Miles and that should not be editable. I want like
Default value of Min Miles is 0.
When I click on Add More Range then In the new form - Min Value should be Max Value of Previous Form.
I am using semantic form for. Please Help Me. How can I do this...
Regarding your second question, and assuming that the new form appears through javascript, without page reloading, you can grab the
field value with javascript and use it as the default value for the
new field. The "add new range"
Something Like
function getvalue(){
var inputTypes_max = [],inputTypes_min = [],inputTypes_amount = [];
$('input[id$="max_miles"]').each(function(){
inputTypes_max.push($(this).prop('value'));
});
$('input[id$="amount"]').each(function(){
inputTypes_amount.push($(this).prop('value'));
});
var max_value_of_last_partition = inputTypes_max[inputTypes_max.length - 2]
var amount_of_last_partition = inputTypes_amount[inputTypes_amount.length - 2]
if (max_value_of_last_partition == "" || amount_of_last_partition == "" ){
alert("Please Fill Above Details First");
}else{
$("#add_more_range_link").click();
$('input[id$="min_miles"]').each(function(){
inputTypes_min.push($(this).prop('id'));
});
var min_id_of_last_partition=inputTypes_min[inputTypes_min.length - 2]
$("#"+min_id_of_last_partition).attr("disabled", true);
$("#"+min_id_of_last_partition).val(parseInt(max_value_of_last_partition) + 1)
}
}
I have Used Jquery's End Selector In a loop to get all value of max and amount field as per your form and get the ids of your min_miles field and then setting that value of your min_miles as per max_miles
It worked For me hope It works For You.
Default value of a field can just be passed in the form builder as a second parameter:
...
f.input :min_miles, "My default value"
Of course I do not know your model structure but you get the idea.
Regarding your second question, and assuming that the new form appears through javascript, without page reloading, you can grab the field value with javascript and use it as the default value for the new field. The "add new range" click will be the triggerer for the value capture.
Something like (with jQuery):
var temp_value = '';
$('#add_more_range').click(function(){
temp_value = $('#my_form1 #min_miles').value();
$('#my_form2 #max_miles').value(temp_value);
});
Again I am just guessing the name of the selectors, but the overall approach should work.
If you are also adding dinamically to the page the "Add new range" buttons/links, then you should delegate the function in order to be inherited also for the so new added buttons:
$('body').on('click', '#add_more_range', function(){...});

Resources