PimenTech-scripts : jquery.jframe.js

Thanks to jQuery library, jFrame provides an easy way to get an HTML frame-like behaviour on DIV Elements with AJAX. It comes with Pimentech Scripts library. Also alvaiable on jQuery_site .

With jFrame, you can build smart, complex modern, internet apps without leaving the main page, without a single line of JavaScript !

A jFrame is a DIV tag with a src attribute. In a jFrame, click events on <a> and <input type="submit"> tags will be handled by jframe and loaded in ajax.

Recent Changes

  • 2011-06-07 : anchor link support
  • 2010-12-15 : removed log messages, stupid
  • Fixed IE problem with form validation
  • You can now activate a link outside a jframe : <a href="url" target="jframe_id" jframe="activate">
  • Toggle attribute on <a> tags : with toggle="off" , the jframe is loaded on the first click, hidden on the second, etc...

Requirements

The following JavaScript files must be included in the head section of your HTML page :

Elements

jFrame : DIV with src attribute

Attributes

  • id : jFrame id, required.
  • src : url or "#", required. After a jFrame load, the src attribute value is replaced by the loaded url.

Links and Submit Buttons

Inside jFrames, onclick events on each link and submit button are redirected to jFrame plugin.

A link

  • With target attribute, the href value is loaded by an xmlhttprequest in <div id=target>. Without target attribute, the href value is loaded in the current jframe. JFrame can be desactivated on a particular link with jframe="no" attribute (same for submit buttons).
  • You can activate a link outside a jframe DIV with jframe="activate" attribute
  • With toggle="off", the first click will load the url link in target jframe and set toggle attribute to on. Then a second click will hide the target jframe (see demo above).
  • Links with anchors are supported (<a href="url#anchor"> ... <a name="anchor">)

INPUT type="submit"

The submit buttons also support a target attribute, like <A> tags.

jFrame forms support get and post method, onsubmit form attribute.

BUTTON type="submit" are also supported.

jQuery API

  • $(div element).loadJFrame(url, callback) : like ajax.load function.

  • $(div element).activateJFrames() : the div element becomes a jFrame.

  • $(element).getJFrameTarget() : if exists, return the first jFrame parent element.

  • $(element).waitingJFrame() : Overload this function in your code if you want for example a "waiting" message. Example :

    jQuery.fn.waitingJFrame = function () {
       $(this).html("<b>loading...</b>");
    }
    

Source

// jFrame
// $Revision: 1.161 $
// Author: Frederic de Zorzi
// Contact: fredz@_nospam_pimentech.net
// Revision: $Revision: 1.161 $
// Date: $Date: 2014-01-20 11:35:41 $
// Copyright: 2007-2009 PimenTech SARL
// Tags: ajax javascript pimentech english jquery


jQuery.fn.waitingJFrame = function () {
    // Overload this function in your code to place a waiting event
    // message, like :  $(this).html("<b>loading...</b>");
};

function _jsattr(elem, key) {
    var res = jQuery(elem).attr(key);
    if (res == undefined) {
        return function() { return true;};
    }
    if (typeof res == 'string') {
        return function() { eval(res); };
    }
    return res;
}


jQuery.fn.preloadJFrame = function() {
    if (_jsattr(this, "beforeload")() == false) {
        return false;
    }
    jQuery(this).waitingJFrame();
    return true;
};

jQuery.fn.getJFrameTarget = function() {
    var target = jQuery(this).attr("target");
    if (target) {
        return jQuery("#" + target);
    }
    // Returns first parent jframe element, if exists
    return jQuery(jQuery(this).parents("div[src]").get(0));
};

jQuery.fn.loadJFrame = function(url, callback) {
    // like ajax.load, for jFrame. the onload->afterload attribute is supported
    var this_callback = _jsattr(this, "afterload");
    callback = callback || function(){ };
    url = url || jQuery(this).attr("src");
    if (url && url != "#") {
        if (jQuery(this).preloadJFrame() == false) {
            return false;
        }
        jQuery(this).load(url,
                          function(response,status,xhr) {
                              jQuery(this).attr("src", url);
                              jQuery(this).activateJFrame();
                              jQuery(this).find("div[src]").each(function(i) {
                                                                     jQuery(this).loadJFrame();
                                                                 } );
                              this_callback();
                              callback(response,status,xhr);
                          });
    }
    else {
        jQuery(this).activateJFrame();
    }
    return true;
};



jQuery.fn.activateLink = function() {
    this.unbind("click");
    this.each(function () {
                  var oc = this.onclick;
                  this.onclick = null;
                  jQuery(this).bind("click", function (event) {
                                   if (oc) {
                                       if (!oc()) {
                                           event.stopImmediatePropagation();
                                           return false;
                                       }
                                   }
                                   return true;
                               });

              });
    this.click(function() {
                   var target = jQuery(this).getJFrameTarget();
                   if (target.length) {
                       var href = jQuery(this).attr("href");
                       var toggle = jQuery(this).attr("toggle");
                       if (href && href.indexOf('javascript:') != 0) {
                           if (toggle == "on") {
                               target.hide();
                               jQuery(this).attr("toggle", "off");
                               return false;
                           }
                           if (toggle == "off") {
                               target.show();
                               jQuery(this).attr("toggle", "on");
                           }
                           target.loadJFrame(href);
                           return false;
                       }
                   }
                   return true;
               } )
        .attr("jframe","activated");
};

function jFrameSubmitInput(input) {
    var target = jQuery(input).getJFrameTarget();
    if (target.length) {
        var form = input.form;
		if (form) {
			if (form.onsubmit && form.onsubmit() == false) {
				return false;
			}
			if (target.preloadJFrame() == false) {
				return false;
			}
			var submit_events = jQuery(form).data("events");
			if (submit_events) {
				submit_events = submit_events.submit;
				if (submit_events) {
					jQuery.each(submit_events, function(i, submit) {
									submit.handler();
								});
				}
			}

			jQuery(form).ajaxSubmit({
										target: target,
										//data:{ submit: jQuery(input).attr("value") },
/*										beforeSubmit: function(formData, theform, options) {
											formData.push({ name:"submit", value: jQuery(input).attr("value") });
										},*/

										/*beforeSubmit: function(formData, theform, options) {
											formData.push(input);
										},*/


										success: function() {
											target.attr("src", jQuery(form).attr("action"));
											_jsattr(target, "afterload")();
											target.activateJFrame();
										}
									});
			return false;
		}
    }
    return true;
}

jQuery.fn.activateSubmitButton = function() {
    this.unbind("click")
        .click(function() {
                   return jFrameSubmitInput(this);
               } )
        .attr("jframe","activated");
};



jQuery.fn.activateJFrame = function() {
    // Add an onclick event on all <a> and <input type="submit"> tags
    jQuery(this).find("a")
        .not("[jframe='no']")
        .not("[jframe='activated']")
        .activateLink();

    jQuery(":image,:submit,:button", this)
        .not("[jframe='no']")
        .not("[jframe='activated']")
        .activateSubmitButton();
};

jQuery(document).ready(
    function() {
        jQuery(document).find("div[src]").each(
            function(i) {
                jQuery(this).loadJFrame(undefined, undefined, true);
            } );
        jQuery(document).find("a[jframe='activate']").activateLink();
        jQuery(":image,:submit,:button", document).find("[jframe='activate']").activateSubmitButton();
    } );

Tips

Loading two jframes with one link

The base idea of jframe is "iframe alternative with ajax", and I don't want to add a non html behaviour like ' a href="url1|url2" '. If you want to load 2 jframes with one link, you have to do it in JavaScript, like :

<a href="javascript:$('#target1').loadJFrame('url1');$('#target2').loadJFrame('url2');">click here</a>

Commentaires

Mike Septembre 23, 2007 at 12:39 après-midi

Hi.
This is really very useful. Thanks a lot !

I just saw one problem :

To select submits, you use
$(this).find("input[@type='submit']")
but submit can also be buttons with type =submit.
(thats what is use with struts2 ....)
So you should put instead
$(this).find("input[@type='submit'], button[@type='submit']")
I tested and it works.

fredz Septembre 24, 2007 at 5:18 après-midi

Done ! Thanks for your support.

milton Septembre 26, 2007 at 7:48 matin

Has anyone got a functioning demo of this in action?

Serge Septembre 28, 2007 at 11:40 matin

If you select a person in the demo, then click edit, save it, and THEN click edit again, the edit part is loaded.

Stan Septembre 28, 2007 at 4:20 après-midi

Fixed.
The people_list div is now reloaded when a people_detail form is submited.

Javascript links Octobre 5, 2007 at 6:02 matin

Are you planning to support javascript links using "this"

fredz Octobre 5, 2007 at 9:15 matin

? Javascript links are ignored by jFrame

edwo Octobre 6, 2007 at 8:58 après-midi

XHTML do not support 'src' tag, any suggestions?

daniel Octobre 15, 2007 at 12:32 après-midi

I like it, but same problem, src tag ist not xhtml valid - any suggestions?

fredz Octobre 15, 2007 at 12:49 après-midi

Write to the W3C ?
Seriously, what is the real problem ? jFrame lib is a kind of html extension, I prefer adding an explicit attibute like src, rather than reusing wrongly a valid attribute.
But if you have a better idea, we are open.

Peter Octobre 19, 2007 at 6:16 matin

Has anyone used the jQuery Taconite plugin with jframe using a form?

I designed a form within a <DIV> with SRC="#", with a TARGET to another DIV, that will return data formatted for Taconite (XML) .

The firebug plugin shows at the end: Node cannot be inserted at the specified point in the hierarchy.

However, if I do a regular <A> to the CGI that returns the same data, Taconite works fine and the desired effect is achieved.

Any suggestions? Seems to be a problem of a combination of forms (jform is being loaded), Taconite and jframe. Any suggestions?

Jon Novembre 13, 2007 at 1:27 matin

It appears to me that jFrame breaks the jquery validate plugin. I am not sure who's "fault" it is, but my guess is that because you are overriding the onclick behavior, the form submission never gets to happen.

I just finally figured out there was a conflict, so now I'll start looking to see how I can change the jFrame code to not conflict. My guess is that I remove the automatic "jframing" of the form, and manually call it from the validation code on form submit.

Jon Novembre 13, 2007 at 3:29 matin

Ah, got it.

If I add:
if(!($(form).validate().form())){
return false;
}

just below the if(form.onsubmit...) in jframe.js, everything works out fine.
I guess the right solution would be for jframe to support a callback. I think the problem has to do with the form.onsubmit that you are calling doesn't really do the right thing, if other ajax controls are in place. Something like that.

James! Novembre 19, 2007 at 5:19 matin

Excellent stuff - stop complaining people, it suis most peoples needs - quick and easy ajax - I love it!!
If you can'cope with the compliency write ajax yourself - it's not THAT difficult!!!

fredz Novembre 19, 2007 at 9:07 matin

To Jon :
You can do like that :
<form id="f" onsubmit="return $('#f'').validate().form()">

(beware, you can't write "this.validate().form()" cause the onsubmit attrivute is "evaluated" by jframe)

To James! :
Thanks, I love you.

Marco Antonio C. Santos Novembre 22, 2007 at 12:48 matin

Great jQuery plugin. Really awesome. Do you have an example using Form Validation(required fields)? Your demo haves an example without required fields. Cheers

stan@pimentech Novembre 28, 2007 at 11:27 matin

I have fixed the demo' form to use required fields.

Marco Antonio C, Santos Novembre 29, 2007 at 3:48 après-midi

Your demo page is 404 error(page not found).

stan@pimentech Novembre 29, 2007 at 3:53 après-midi

Oups,
should works now, thanks.

test Décembre 8, 2007 at 1:31 après-midi

sd

Sean Décembre 10, 2007 at 7:18 matin

Is there a way to implement a back feature, whether using the browser back button or a link in the frame? I searched around a little on the web and could not find anything about this.

Great plugin, thanks.

fredz Décembre 12, 2007 at 1:10 après-midi

Back feature would be useful, but we'd have to implement a stack with url history + attached jframe. I have no time for the moment. If someone is interested to implement that, let me know.
Thanks for your comment.

Alexander Décembre 19, 2007 at 1:16 matin

I really like the script, good job! I love that it isn't overkill like a lot of other jQuery-plugins I've seen. But I agree on that a back-feature would be very useful.

Well, it's not not all problem-free. I've got a problem that I can't seem to solve. I made an example to show you what the problem is. Please take a look at http://help.alleballe.nu/.

I would really appreciate help with it..

Mr Window Décembre 20, 2007 at 2:45 après-midi

First of all, nice script. Really nice. Quick and easy like it sais really no hassle it almost feels like an addition to the HTML language.

I have one little problem though (not too serious for my use). When I try to load an external link (say google) it opens in a new window/tab and not in the target div. Perhaps I'm doing it wrong, I'm not too much of a JavaScript genius. I tried http://www.google.com in the href and without the http both without succes.

I'm not using that though but perhaps it would be nice for the future. Anyway, very nice script thanks for the good work!

fredz Décembre 20, 2007 at 3:03 après-midi

Mr Window, your problem is ajax security related : you can't do an external http request with javascript.

fredz Décembre 20, 2007 at 3:13 après-midi

Alexander, your form tag is not closed !

Roy Décembre 28, 2007 at 10:55 matin

I have created a page that contains a form and a $(document).ready function.

When the page is loaded and the ready function is called the form collection is empty.

I moved the script that initialize the form from the ready function to the end of the page and now the form collection is not empty and it works fine.

Either I am missing something (probably as I am new to jQuery) or there is bug - I thought that ready is called when the document is initialized and ready to be processed.

fredz Décembre 28, 2007 at 11:01 matin

Could you give urls for the 2 cases ?

Dado Janvier 4, 2008 at 7:40 matin

Can jFrame loaded pages go across domains?

james_027 Janvier 9, 2008 at 7:33 matin

hi,

Thank you for this wonderful plug-in you've shared to the community. Recently I run into trouble, which is not a jFrame bug at all but it's because IE's caching. In jQuery we can call $.ajax() function with cache:false, but I don't know how to apply it in your plug-in

Thanks

Piere Janvier 21, 2008 at 12:55 après-midi

Hi,

you plugin is awesome, you did there a good job :)

i have a question i couldnt solve myself atm.

how can i possible accsess the jframe per flash? ive tryed to target the actionscript link to jFrame but actually it only loads in a seperate window.

maybe there is a way to javascript such an actionscript loadframe1();

how could i possible accsess the jframe per javascript function?

cheers
piere

fredz Janvier 21, 2008 at 2:44 après-midi

Piere,
the jframe could be loaded with :
$(element).loadJFrame(url, [callback function])

fredz Janvier 21, 2008 at 2:55 après-midi

james_027, have you tried ajaxSetup function ?

Piere Janvier 21, 2008 at 3:22 après-midi

Hi fredz, thank your for your response :)

Iam new to js, could you please descripe this api call on your example?

i would like todo something like this:
i see per firebug console that the site loads the content when i enter the site, but it doesnt loads the content to its frame :/

<script type="text/javascript">
function loadMyFrame(url,target){
jQuery(target).loadJFrame(url);
$(target).loadJFrame(url);
}
loadMyFrame('test.html', 'jFrame');
</script>

Krasi Janvier 27, 2008 at 10:44 après-midi

When I submit the newly generated form(in the target div) with 'Enter' in IE, it reloads the whole page with the result of the submitted script(so that everything else on the page has disappeared). If I use the submit button, though, it reloads in the place expected. Both 'Enter' and submit button work fine in FF. So what could be the case with IE?

fredz Janvier 29, 2008 at 4:03 après-midi

Don't know. Any IE users ?

Jeffrey Janvier 29, 2008 at 7:40 après-midi

Great API!! I have implemented this easily but I am having no luck getting my <div id=people_list> to refresh or GET after the form has Posted the update. In the example there is a POST and then a GET that refreshes the list. In mine I am only seeing a POST action. Any thoughts??

Thanks

Krasi Février 2, 2008 at 9:50 matin

Has anyone achieved file uploads? The Form plugin which JFrame is based on does support them.

Peter Février 8, 2008 at 7:20 matin

Can anyone take a look at this problem? Use firebug to see the problem:

http://72.18.207.149/english/taconite-te...

It uses the jframe plugin, and the taconite plugin. For some reason, somehow, jframe causes some kind of problem on how taconite receives the response back from the server.

The problem does not occur with regular jquery ajax calls. Only with jframe. Any ideas?

MrPicker Février 12, 2008 at 1:03 après-midi

Hi, you plugin is very good.

But, i have tired width link (http://www.google.com) in ""<a href="index.html" target="jframe2">"" instead of index.html, but i don't work... i see a blank page.
Can i insert a link instead of a local page?

Thanks

dlm Février 22, 2008 at 9:57 matin

Krasi, I have the same ie-goes-to-new-page problem on my practice build, too. The interesting thing is, the demo on this site works as it should both when you click on the submit button *and* hit the return key.

Unfortunately, my project requirements stipulate ie so I can't really ignore it. Did you find a solution?

ps... Great plugin fredz! Wish I would have found it months ago. Thanks!

Michael Sandoz Février 27, 2008 at 6:22 après-midi

Hello, your solution is awesome!

I added an add record form to your sample. How can I get the people list to update after insert.

地耍花样 Mars 6, 2008 at 4:59 après-midi

塔顶

raduen Mars 15, 2008 at 4:42 après-midi

Nice plugin,
But i can't get it to work with eg
sample: have a div called odd with src="#"but when i clik on the link <a href="upload.php" target="odd"> it keeps opening the page in a new window. (ie)

Dips Mars 31, 2008 at 2:12 après-midi

@raduen and others with this issue:

This works if the link is INSIDE the div. If it's outside such as in another separate navigation bar, it won't work.

I don't have a solution to this but here's an alternative:
http://javascript.internet.com/ajax/ajax...

:-)

Levy Avril 3, 2008 at 8:31 matin

Some one know How get the people list to update after insert.

Thanks

levy Avril 3, 2008 at 8:38 matin

<script type="text/javascript">

$("#people_list").loadJFrame($("#people_list").attr("src"));

</script> ????

stan@pimentech Avril 3, 2008 at 9:50 matin

That's correct.

ernesto Avril 5, 2008 at 2:43 après-midi

It's a great plgin. But I ave a problem: I am trying to pass some parameters in this way:
<a href="simple.php?af_feed=<?php echo $ff_params; ?>" target="jFrame1">my_link</a>
And it does not work propertly.

michi Avril 10, 2008 at 12:49 après-midi

I don't think that it`s possible to get just on div from a cross-domain, is it?

I think that is prevented by the cross side scripting restrictions, isn't it?

michi Avril 10, 2008 at 12:52 après-midi

on = one or single....

I'm think of somthing lilke this: http://developer.apple.com/internet/webc...

Tony Avril 11, 2008 at 6:51 matin

Hi,

Trying to get the jFrame plug-in to work but unsure how to use it.

I have set-up the follow div, i.e:

<div id="content" src="#"></div> and then make a call to:
jQuery("#content").loadJFrame(returnURL);

The div loads successfully but I get a javascript error:

Line: 200364044
Char: 3
Error: Object doesn't support this property or method

Can someone please let me know what I have missed and please correct/show me the correct usage of this plug-in.

Thanks.
Tony.

trifide Avril 28, 2008 at 12:50 après-midi

what about a confirm button? if I try to put a confirm alert in the submit button, the alert pops up, but next, if I click on "cancel", it doesn't stop and sends the form... ( it doesn't pass the "false" to the onclick/onsubmit function ... ) maybe there is a simple workaround for this but ... thanks in advance;

aaron Mai 15, 2008 at 1:54 matin

I have a problem that's a more complicated version of what's illustrated in the index.html example file above.

Basically, I can't get the submit button to update a DIV. It doesn't seem to work in my test or in the example file. The 'submit' button fire, but doesn't update jframe2.

Has anyone else had or seen this problem?

I'm using:
jquery-1.2.3.min.js
jquery.form.js - 2.10
query.frame.js 1.0.1

Thank you.
aaron.

Jeremy Mai 16, 2008 at 9:28 après-midi

@aaron - it appears that the update does not work in IE but does work in FF

Antoine Mai 22, 2008 at 3:41 après-midi

Hey!

I am facing a problem when I submit a form and use JFrame.

This is a sample source code to illustrate :

### test1.html
<html>
<head>
<script type="text/javascript" src="/js/jquery-1.2.4.min.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script type="text/javascript" src="/js/jquery.jframe.js"></script>
</head>

<body>
<div id="div1" src="#">
<form action="/test2.html">
<input target="action" type="submit">
</form>
</div>

<div id="action" src="#">
Empty for the moment.
</div>
</body>
</html>

### test2.html
Inside test2.html
<div id="div2" src="/test3.html" />

### test3.html
Inside test3.html

When I click the submit button of the form, I should see "Inside test2.html Inside test3.html".

Instead, I only see "Inside test2.html". No call to test3.html is made.

Can anyone give me a hint on that?

Thanks!

JCF Juin 2, 2008 at 4 après-midi

Hi

I have a problem I am hoping you can help with. I am using Codecharge 4, I have page with the Containter div and two other div in it.

The first has a Codecharge Menu driven by the database it and the second is where the pages from the menu are to go.

I works just great for the first page change from the menu say to a browse, but when I pick one of the items in the browse, it never updates.

I can refresh the page but it just goes back to the start.

I have check the includes and placement, I have checked that the second page has the correct target in it.

Is there some sort of reset I need to run or something

Thanks for your help

JCF

VA Juin 18, 2008 at 9:14 matin

How can I get google maps to work correctly. Any one have some ideas?

Ken Juillet 21, 2008 at 4:35 après-midi

I'm having the same problem as trifide above. I'm trying to use a confirm alert, but no matter if I press 'Ok' or 'Cancel', the link still proceeds to go through. Anyone find a fix. I really need the confirm alert, as it is on a delete action.

董明 Juillet 23, 2008 at 2:48 après-midi

你好.您能把这个例子的源代码发我吗.

我学习一下.谢了

dongming_9431@163.com

Matt Juillet 31, 2008 at 2:07 matin

Same problem as VA... cannot embed google maps inside jframe.

fredz Juillet 31, 2008 at 9:54 matin

I'm not surprised that you can't load google maps inside jframes. Google map uses a huge machinery of javascripts events, so the jframe library could not be transparent for gmap

There is also a possibility of security exception (you can't do an ajax.load outside your domain)

So I think you should forget this idea :(

George Papadopoulos Septembre 1, 2008 at 12:37 après-midi

to Antoine (and others ;-)):

i was facing the same problem...

Solution: Just add
target.find("div[@src]").each(function(i) {
target.loadJFrame();
} );
after target.activateJFrame();
in function jFrameSubmitInput

zihotki Octobre 10, 2008 at 2:57 matin

Hello, I've tried to use onload attribute for div (citate, "like ajax.load, for jFrame. the onload attribute is supported") but it didn't work for me (I'm using the latest version of the jquery( 1.2.6) and jform(version: 2.12) at the moment.
I've changed loadJFrame function to the following and all is ok:
jQuery.fn.loadJFrame = function(url, callback) {
// like ajax.load, for jFrame. the onload attribute is supported
var this_callback = eval(jQuery(this).attr("onload")) || function(){};
callback = callback || function(){};
url = url || jQuery(this).attr("src");
if (url && url != "#") {
if (jQuery(this).preloadJFrame() == false) {
return false;
}
jQuery(this).load(url,
function() {
jQuery(this).attr("src", url);
jQuery(this).activateJFrame();
jQuery(this).find("div[@src]").each(function(i) {
jQuery(this).loadJFrame();
} );
this_callback();
callback();
});
}
else {
jQuery(this).activateJFrame();
}
};

PS. thank you for this cool plugin :)

fredz Octobre 13, 2008 at 8:05 après-midi

Hello all,
jquery 1.2.6 has affected the .attr function on "onload" and "unload" attributes.
Now if you do a $(jframe).attr("onload') you get a javascript function and not a strings, wich is pretty cool except it does not work like that with IE6...

Anyway, I've updated the script (and the example page), tell me if you encounter problems.

Fred.

Joe Octobre 28, 2008 at 8:49 matin

Hi, this is just perfect!!... can anyone tell me how to make uploads with this pulgin..

Thank You

kkkkjul Novembre 7, 2008 at 10:21 matin

HI. you seem to have a cool brain. this module is almost perfect.

but it have a one problem. if jframe load, memory leak happen in i.e, especiaily when disappeared frame have many event listener..

thank you for developing this jframe.~~~~

fredz Novembre 7, 2008 at 10:55 matin

Hi kkkkjul,
could you (or other) insert the line
jQuery(":image,:submit,:button,a", this).unbind("click");
in the beginning of jQuery.fn.loadJFrame function and tell me if it solve your problems.

See "contact" link above to contact me directly.

Thanks,
Fred.

ludmil Novembre 12, 2008 at 8:20 après-midi

How do you update two jFrames at a time from a single link?

kkkkjul Novembre 13, 2008 at 6:28 matin

hi fredz

i inserted "jQuery(":image,:submit,:button,a", this).unbind("click");"
but it is still a memory leak. I use 'drip' with the leak check(i use ie7).
i think I use event listener because it raised memory leak. but all html is raised;

p.s here demo http://garage.pimentech.net/examples/jqu... is error page in ie7
and
i'm sorry for my mess english level.

fredz Novembre 13, 2008 at 10:16 matin

Hi kkkkjul ; I've corrected _jsattr to work with IE7. The demo is now funtional.
Other browser specific problems ?

kkkkjul Novembre 13, 2008 at 11:52 après-midi

re-hi fredz

firefox and crome work very well.

but ie7 is crazy for me

here demo is raised memory leak
http://www.bizhard.com/pub/weblink.aspx?...

fredz Novembre 17, 2008 at 9:17 matin

I have no tool to investigate memory leaks on our windows machine ; I've just tested the demo on IE7 and for me it works. I could spend some time to resolve your IE7 problems, but I need more information.
Contact me directly by email.

jose Novembre 26, 2008 at 9:33 après-midi

i have problems with accents only when i use mysql insert into jframe, can you help me?

fredz Novembre 26, 2008 at 11:43 après-midi

to jose :
it is not a jframe related problem.
Multiple-encoding is a headache. Choose utf-8 encoding on all your chain (database, webserver, webclient).

Gonzaloq Décembre 7, 2008 at 3:06 matin

How can I use People List and Peple Detail in my server. Do I need to create a directory with a bunch of files etc..? Would it be possible to use a dynamic page to populate People List? I am just lost in how to duplicate your data schema for Jframe1 and jframe2. Any help?

Also, I am a SQL, ASP type of developer and kind of new to your smart jquery plugin. Thanks!

fredz Décembre 7, 2008 at 9:46 après-midi

To gonzaloq :
The example code is alvailable, but it was developed with python django framework, so you have to rewrite it with ASP :
1. Forget jframe
2. write your database model and prepare your queries
3. write your web application without javascript
4. Ajaxify it with jFrame
5. Explore ASP alternatives :
http://bits.blogs.nytimes.com/2008/12/01...
“The difference between free, and non-free or proprietary software, is similar to the divide between science and alchemy. Before science, there was alchemy, where people guarded their ideas because they wanted to corner the market on the mechanisms used to convert lead into gold.”

Victor Décembre 9, 2008 at 5:25 après-midi

How do you force the reload of people_list div once the people_detail is submitted? I can't figure this out. I would appreciate some insight!
Thanks!

This rocks, BTW.

mob Décembre 13, 2008 at 3:49 après-midi

i have a jquery treeview and jframe but treeview's expand and collapse all does not work. because it opens another jframe because the anchor is #. maybe. how can i solve this???

mob Décembre 13, 2008 at 4:15 après-midi

1. is it possible to have refresh button on each div?
2. Select all checkbox by one checkbox javascript does not work why?
3. how to avoid treeview expand collapse menu conflict?

PLZ HELP

fredz Décembre 15, 2008 at 9:23 matin

To mob : you can disable jframe on a link with jframe="no" attribute.

mob Décembre 25, 2008 at 6:25 matin

sorry fredz but how?

wzh Janvier 9, 2009 at 8:33 après-midi

hi fredz,this plugin is good, thank u hard work.

i need this pingin API Example.thank u .

fredz Janvier 12, 2009 at 11:36 matin

to wzh :

The example is written in django are located there :

http://trac.pimentech.org/pimentech/brow...
http://trac.pimentech.org/pimentech/brow...

colin Janvier 21, 2009 at 2:49 matin

Hi, great work. Found that under jQ 1.3 you have to remove the @ in div[@src]

fredz Janvier 21, 2009 at 3:14 après-midi

Thanks Colin, the @ prefix was already deprecated in 1.2.6 ; I've removed it.

jFrame Janvier 29, 2009 at 7:28 matin

hello FREDZ,
i have one question, i am total newbie in jQuery.
I would like to know that is it possible to have link from other page.

Tried:

<a href="javascript:$('jframe.php#detail').loadJFrame('inc/detail.php?page=1');">Detail 1</a>

also

<a href="jframe.php" onlick="javascript:$('#detail').loadJFrame('inc/detail.php?page=1');">Detail 1</a>

but is it not working,

PaulD Février 10, 2009 at 5:25 matin

Superb. This is really going to help my new project. Thank you! Very impressed. Takes so much work out of using jquery for newbies. Cant wait to try it out properly, but it is late now. Very exciting though. Thank you.

Ben Mars 27, 2009 at 12:25 après-midi

OK, Finally got it. When you want to do something after a submit, you have to return a script reference with javascript in it.
For Example go to the demo: Click on the Edit, click on the submit button. Check the response of the post. It has a script tag in it which has the command to update the list. Got it.
I reckon this particular issue is worth a comment in your doco.

js Avril 17, 2009 at 5:16 matin

非常不错 顶!

党员 Mai 13, 2009 at 11:58 matin

也来瞧瞧

Darren Septembre 8, 2009 at 12:50 après-midi

I can't figure out what the HTML is called that is called at /examples/jquery_jframes/people/list/

no matter what I put in /examples/jquery_jframes/people/list/ as the HTML it doesn't get called.

Any ideas?
Darren

Rodrigo Septembre 9, 2009 at 10 après-midi

Hi, When I start my page with ie7 I get the following error:

"Syntax error, unrecognized expression: "[@src].

Any ideas? Greetings

Phil Septembre 18, 2009 at 6:11 après-midi

Great plugin, thanks!
I've found an issue: if I have an input outside of a form, I get an error " form is null" on line 33. But the html spec says that it's a normal case: "The elements used to create controls generally appear inside a FORM element, but may also appear outside of a FORM element declaration when they are used to build user interfaces. This is discussed in the section on intrinsic events. Note that controls outside a form cannot be successful controls." Link: http://www.w3.org/TR/html401/interact/fo...

fredz Septembre 21, 2009 at 12:06 après-midi

Thanks Phil, could you send me an example ?

sure Septembre 24, 2009 at 10:30 matin

I want to get your demo!

Can you send it to my Email:caoshuo515@tom.com .
thankyou very much !

fredz Septembre 24, 2009 at 10:39 matin

To get the demo, it's a bit complicated ; it's written with the django framework, inside pimentech garage site.
See :
http://trac.pimentech.org/pimentech/brow...
and
http://trac.pimentech.org/pimentech/brow...

Roey Novembre 17, 2009 at 9:35 après-midi

When a from has multiple submit buttons in form - used for insert/update/delete by setting name of the button the server side can find what button was pressed. pleases change function function jFrameSubmitInput(input) line:
formArray.push({ name:"submit", value: jQuery(input).attr("value") });
to
formArray.push({ name: jQuery(input).attr("value"), value: jQuery(input).attr("value") });

Roey Novembre 17, 2009 at 9:37 après-midi

Oops error meat change line to
formArray.push({ name: jQuery(input).attr("name"), value: jQuery(input).attr("value") });

fredz Novembre 18, 2009 at 12:58 après-midi

To Roey:
This patch doesn't work with
<input type="submit" value"insert" />

I can't remember exactly, but there are some drawbacks with IE 6/7 and multi-submit buttons, and the only option is to use "value" attributes.

See the updated demo

Arnas Risqianto Décembre 5, 2009 at 1:53 matin

I have tried on Google Chrome and it didn't work

fredz Décembre 6, 2009 at 2:10 après-midi

Ooops ! Please try the new version here (not submited yet to jquery site)
Also, onload attribute could'nt be overloaded with webkit, i've replaced these tags with "beforeload" and "afterload". I'll rewrite the doc later

morowind Décembre 23, 2009 at 12:51 après-midi

We love your work.
Please insert in your example" upload files control".Will be very usefull for many users.

thank's in advance

llll Février 27, 2010 at 8:23 après-midi

llllll

Comments

blog comments powered by Disqus