CODEWITHSUNDEEP
javascriptjquery
ravi
ravi

Reputation: 161

passing object over function in javascript(one function to another function)

When I pass object through on mouseover, I did not get object data in function, and map web page stuck loading. This box text having image frame on map.

code:

function imagefream(Info) {

//Info having data(Info.Lat,Info.Long....etc)

    alert(Info.toSource()) //get all data of lat,lon,id..etc
    var boxText = document.createElement("div");
    boxText.innerHTML = '<div id=\"outer\" style=\"overflow: auto; cursor: default; clear: both; position: relative; background-color: rgb(0, 136, 204); border-color: rgb(0, 136, 204); border-style: solid; border-radius: 5px; border-width: 1px; padding: 3px; width: 50px; height: 50px;\"  onMouseOver=\"funinfo(' + Info + ');\" >' +
        '</div>';
    return boxText;
}

function funinfo(Info) {
    alert("123");
    alert(Info.toSource());
}

Upvotes: 1

Views: 103

Answers (2)

alsafoo
alsafoo

Reputation: 788

Here is solution for your problem. Notice i am declaring a namespace

    var myNamespace = myNamespace || {};
$(document).ready(function(){   
    myNamespace.info = {Lat: 42.123456789, Lng: -41.123456789}; // some object
    myNamespace.funinfo = function (Info) {
    console.log("logging from funinfo: " + Info.Lat + "," + Info.Lng);
}
    myNamespace.imageFrame= function(Info){
    myNamespace.info = Info;
    console.log("logging from imageFrame: " + myNamespace.info.Lat + "," + myNamespace.info.Lng);
    var boxText = document.createElement("div");
    boxText.innerHTML = '<div id=\"outer\" style=\"overflow: auto; cursor: default; clear: both; position: relative; background-color: rgb(0, 136, 204); border-color: rgb(0, 136, 204); border-style: solid; border-radius: 5px; border-width: 1px; padding: 3px; width: 50px; height: 50px;\"' +
    'onMouseOver=\"myNamespace.funinfo(myNamespace.info);\" >' +
        'MyDIb</div>';
    return boxText;
}
    var d = myNamespace.imageFrame(myNamespace.info);
    document.body.appendChild(d);   

});

Upvotes: 1

Peterson Domingos
Peterson Domingos

Reputation: 72

You are concatenating an string to an object-> '...onMouseOver=\" funinfo('+Info+');\"...'

It will generate something like that -> 'onMouseOver="funinfo([object Object]);"'

Seems that what you wanna do is call the function funinfo passing the object Info, so thats what you need in your onMouseOver property. Your code should looks like that -> 'onMouseOver=\" funinfo(Info);\"'. No need to concatenate the object.

Note that Info should be in your window, or global space.

Upvotes: 2

Related Questions