Login Register

Set href with anchor into ContentPane

Hi,

I would want to do setHref("mypage.html#anchor") from a ContentPane, without success... The pane doesn't scroll to #anchor.

Is there another way to do it ?

Thanks,

not out of the box. you

not out of the box. you could do something like: (this code snippet probably doesnt work, but is the right direction i think):

mypane.setHref("myPage.html");
var node = dojo.query("a[name='someting'],mypane.domNode)[0]; // i think, look at CSS3 selectors
var f = dojo.coords(node); // returns x and y position of the node
mypane.scrollHeight=f.h+"px"; // or f.x?

there is code in dojox you can look at the get an example:

dojox/fx/scroll.js and dojox/fx/tests/test_scroll.html

hope this helps.

dante, Thank you for this

dante,

Thank you for this code snippet; it was the good direction.

The most important change I've made is to attach the scroll positioning on pane loading event, otherwise you can't reach anchor link:

dojo.connect(dijit.byId("mypane"),"onLoad",function(evt){
    ...
});    
pane.setHref("mypage.html#anchor");

The anchor name can be catched through a RegExp:

var regexp=new RegExp(".+#(.+)");
var match=regexp.exec(page);
if(match!=null){
    var anchor=dojo.query('a[name="'+match[1]+'"]')[0];
}

Finally, I change scroll position:

var coords=dojo.coords(anchor);
dojo.byId("thepane").scrollTop=coords.t;

If it can help someone else...

Complete example?

Would either of you mind posting a complete example?

Thanks,
cw

Context: "mainpane" contains

Context: "mainpane" contains a menubar and "contentpane".

I use links with something like that:

go there
// Change pane page
function changePage(id,page){                                                                                                                                      
    var pane=dijit.byId(id);
    var handle=dojo.connect(pane,"onLoad",function(evt){
        var regexp=new RegExp(".+#(.+)");
        var match=regexp.exec(page);                                                                                                                            
        if(match!=null){
            var anchor=dojo.query('a[name="'+match[1]+'"]')[0];
            var coords=dojo.coords(anchor);
            var contentpane=dojo.byId("contentpane");                                                                                                                  
            contentpane.scrollTop=coords.t;
        }
        dojo.disconnect(handle);
    });                                                                                                                                                         
    pane.setHref(page);
}