Cannot export extra data from Freebase using Jquery - javascript

A newbie question,
I am trying to use Freebase Suggest as a tagging resource for my Django project. I want to extract item name, type and id. For example, as you can see in the screenshot, I want to extract the name 'Pearl Jam' ,its id '/en/pearl_jam', and the type 'band'.
How can I post this data to my view?
Using the function below I can only create links to the tags.
$(function(){
$("#myinput").suggest().bind("fb-select", function(e, data) {
$('#myinput').val(''); // clear the input
$('#returnValueOfFreebase').append(''+ data.name +' ')})
});

You already have the name and the ID from data.name and data.id. You can also access the notable type from your callback function by using data['n:type'].name like this:
$(function(){
$("#myinput").suggest().bind("fb-select", function(e, data) {
$('#myinput').val(''); // clear the input
$('#returnValueOfFreebase').append(''+ data.name +' (' + data['n:type'].name + ')')})
});
If you want to capture this data and post it back to your web app, you can create some hidden inputs and set their value from the Freebase suggest callback. Like this:
<input id="notable_type" name="notable_type" type="hidden" />
$("#myinput").suggest().bind("fb-select", function(e, data) {
$("#notable_type").val(data['n:type'].id);
});

New Api use data['notable'] instead of data['n:type']

Related

Post HTML Table to Controller

I have a form where users can dynamically add entries to a html table from a dropdownbox. Each entry is added as its own row. This is fairly easily done in javascript:
function addProduct(int type) {
var product = getProduct(type); // The method just fetches the product from the database
$('selectedProductsTable').append("<tr><td>" + product.Name +"</td><td>" + product.Quantity + "</td></tr>")
}
In a second step the contents of the table need to be posted to the controller for further processing. What is the general best practice to get the products i've added as table rows? I could iterate over the rows of the selectedProductsTable but that seems somewhat error prone.
On the other hand i would be open to another way to persist the selected items so that i can post them to the controller. Unfortunately saving them in the session or in the tempData is also not a good option since the selection takes place completely in javascript.
Only INPUT and SELECT elements get posted back to the server, so you need to store each value in hidden fields to make it back. You can use the index-based approach to post back an array, which works well. See this post.
I wrote up a blog post about dynamic client-side lists, which might be helpful. It uses Kendo Core but that would not be required.
In your method addProduct populate array with data about products:
var products=[];
function addProduct(int type) {
var product = getProduct(type); // The method just fetches the product from the database
products.push(product)
$('selectedProductsTable').append("<tr><td>" + product.Name +"</td><td>" +
product.Quantity + "</td></tr>")
}
and later send it with ajax:
$.ajax({
url: 'your url',
type: 'POST',
dataType: 'json',
success: function (data) {
//TODO
},
data: JSON.stringify(products)
});

Passing a JavaScript object from my form to my Node app

I have this jQuery code that gets data from my form. I used a console statement to see the value. However I want to pass the data to my Node application so that I can insert into a database.
$(function() {
$('#kiosk_signin').submit(function() {
var data = $('#kiosk_signin :input').serializeArray();
console.log(data[0]);
});
});
Please let me know what I need to do.
Assuming you are using express, posting this to your route.., and inserting into the DB..
You would do something like this in your routes..
router.post('/whereever', function(req,res,next(){
///assuming kiosk_signin is the name of an input field
///and the action is ='/whereever' method='post'
var data = req.body.kiosk_signin
console.log('if you want to log it', data)
db.insert({propert: data}).then(function(){
res.redirect('/home')
})
})
I don't use JQuery for submitting forms if I have a full-stack app, just because I intend on sending it directly to the server. Hopefully that helps..

How to append params to ajax request in Select2?

i'm building a web app using Laravel, and i have to implement tag selection, like this one used by stackoverflow, loading options via ajax and if is not exist create it, i did choose Select2 jquery plugin, the problem i have with it, is cant get it to append parameters to the ajax url,
Route :
/tags/{tag}
how can i append the term of select to my url ?
In Select2 3.x, you can pass a function as the ajax.url option. It will be passed the current search term as the first parameter, which sounds like what you are looking for.
$element.select2({
...
ajax: {
url: function (term) {
return '/tags/' + term;
},
...
}
});

Get dynamic value to plugin options after the dom load. (Fineuploader plugin)

I am hoping for your help on this one.
I am using Fineuploader and I need to get and send input field value (that will be file group title).
For that I am using path to server side script (I didn't code it thats why I have to do it on my side, somehow):
endpoint: '/Services/hndFileUploader.ashx?case=deals&dealfiletitle=' + $("input").val()
Problem is that DOM with Fineuploader is already loaded and value of input is of course empty.
How can I get dynamic value to send with that query?
Thank you.
You do this using the setParams option for fineuploader. Docs are here, but basically it could be something like:
$('#fineUploaderElementId').fineUploader({
request: {
endpoint: '/Services/hndFileUploader.ashx'
}
}).on('submit', function(event, id, filename) {
$(this).fineUploader('setParams', {'case': 'deals', 'dealfiletitle': $(input).val(); });
});

$.get with dynamic data names?

I am having an issue trying to set the data name or the objects being passed in. I am writing a system that uses AJAX to send requests to the server which then returns the necessary data. However, I am trying to make things generic to where if the developer adds more "slates" then it will automatically send the request on its behalf. The code looks as following:
$(document).ready(function() {
$(".slate").each(function(){
$.get("requests.php", { $(this).attr('name') : "true" }, function(data){
});
});
});
in other words it takes the name of the element and applies it to the query string. JavaScript doesn't seem to like the
$(this).attr('name')
in the syntax which is understandable since it expects just text (not a var or a string). Is there a way to make this work? Any help is greatly appreciated!
$(document).ready(function() {
$(".slate").each(function(){
var data = {};
data[$(this).attr('name')] = "true";
$.get("requests.php", data, function(data){
});
});
});

Categories