» »

Download vsebine strani s JS

Download vsebine strani s JS

alexa-lol ::

hej :D je stran...

Abc bla bla



Kako bi naredil gumb in to v JS, da bi lahko to stvar mer
<p> </p>
shranil v recimo .txt formatu na računalniku.

hvala in lp ;)

FrEaKmAn ::

Kaj? Iz naslova mi je jasno kaj hočeš, iz opisa pa popolnoma nič!

alexa-lol ::

Bila bi stran....
na tej strani bi bila vsebina in gumb Download.
Gumb bi sporožil tako funkcijo, da bi dobila vsebino med
<p> </p>
in potem bi ti brskalnik javil, da se hoče downloadati neka datoteka. Se da to naresti samo z JS al je treba prek AJAX na server zahtevo poslati (potem server to sestavi in ti da možnost downloada).

Lp

technolog ::

Ne, žal rabiš server-side language, z ajaxom poslat vsebino med tagoma, server pa potem odgovori z datoteko, ki jo user potem prenese.

Tody ::

alexa-lol ::

hvala vsem za odgovor :D

@Tody... to je točno to kar rabim, bom preučil

lp

alexa-lol ::

hej :) kako bi pa rešil obraten problem...
imam vsebino na disku (vsebina.txt) in bi jo rad uploadal na "stran" v textarea...

Ima kdo kakšen link?

hvala in lep pozdrav

Gandalfar ::

alexa-lol je izjavil:

hej :) kako bi pa rešil obraten problem...
imam vsebino na disku (vsebina.txt) in bi jo rad uploadal na "stran" v textarea...

Ima kdo kakšen link?

hvala in lep pozdrav


Imas na serverju ali userjevem racunalniku?

Ce je na serverju .. si poglej jquery.get() recimo. Ce na userjev racunalniku, se ne da. Mora user uploadat skozi file dialog.

alexa-lol ::

Na userjevem računalniku... no sej to sem mislil, da bi preko Open File Dialoga uporabnik lociral file, potem bi pa nekako to uploadal na server podatke ven prebral in jih vrnil skripti kot string oz. kakorkoli. Se to da?

Lp

Gandalfar ::

alexa-lol ::

aha..thanks.. kako bi pa potem to lokacijo oz. vsebino JS posredoval? Bi dal v session pa bi potem izvajal naprej operacij nad tem?

lp

Gandalfar ::

V session imas userid. Upload pa zapises v bazo in potem ves kaj pokazat vsakemu userju na podlagi ajax requesta.

alexa-lol ::

bom to naredil... imam nekaj tezav s skripto od @Tody

(function($){
	
	// Creating a jQuery plugin:
	
	$.generateFile = function(options){
		
		options = options || {};
		
		if(!options.script || !options.filename || !options.content){
			throw new Error("Please enter all the required config options!");
		}
		
		// Creating a 1 by 1 px invisible iframe:
		
		var iframe = $('<iframe>',{
			width:1,
			height:1,
			frameborder:0,
			css:{
				display:'none'
			}
		}).appendTo('body');

		var formHTML = '<form action="" method="post">'+
			'<input type="hidden" name="filename" />'+
			'<input type="hidden" name="content" />'+
			'</form>';
		
		// Giving IE a chance to build the DOM in
		// the iframe with a short timeout:
		
		setTimeout(function(){
		
			// The body element of the iframe document:
			
			var body = (iframe.prop('contentDocument') !== undefined) ?
							iframe.prop('contentDocument').body :
							iframe.prop('document').body;	// IE
			// tu so tezave
			body = $(body);
			
			// Adding the form to the body:
			body.html(formHTML);
			
			var form = body.find('form');
			
			form.attr('action',options.script);
			form.find('input[name=filename]').val(options.filename);
			form.find('input[name=content]').val(options.content);
			
			// Submitting the form to download.php. This will
			// cause the file download dialog box to appear.
			
			form.submit();
		},50);
	};
	
})(jQuery);


Ta del kode dela, če uporabim jQuery 1.6.2... težava je v tem, da bi moral to nekako ponovno spisati, da bi delal tudi na 1.4.2

Odkril sem, da težave dela .prop in naslednja vrstica (.prop je šele od 1.6 naprej)
Cela skripta doda iframe in not v body en form
Bi lahko kdo priporočal kaj naj spremenim ker nimam izkušenj z jQuery ? :D Lep pozdrav

Zgodovina sprememb…

Gandalfar ::

kaksen poseben razlog, da zadevo spravljas na starejsi jquery?

alexa-lol ::

ja.. je en open source projekt in uporablja jQuery 1.4 in ce zamenjam pri tem projektu z jQuery 1.6 ne dela več :D

Sem poskušal z .append in podobnimi ukazi ampak na iframe nič ne deluje (na katerem koli drugem tagu pa deluje). Vse kar sem našel je bilo kako src pri iframu zamenjaš. Poskusil sem tudi dodati (kot string) celo kodo iframe + input pa ni delalo. Ima kdo kako idejo kako bi dodal?

lep pozdrav

alexa-lol ::

Sem prišel do napredka...
$('iframe').contents().find('body').append(formHTML);


Ampak tuki je problem, ker find(element) je spet samo od 1.6 naprej
Je pa find (selector) od 1.0, a če dam $('body') mi pa izbere zunanji body in ne tega v iframeu...

Je še predlagana rešitev v APIju a ne dela...;(
Selector context is implemented with the .find() method; therefore, $('li.item-ii').find('li') is equivalent to $('li', 'li.item-ii').


kako bi to usposobil?

lp

Gandalfar ::

a imas iframe na isti domeni? :)

Zaradi 'same origin policy' (googlaj) ne mores sarit po iframih, ki so v tujih domenah.

alexa-lol ::

kako to misliš na isti domeni?

Vse skupaj je pod localhost

Gandalfar ::

$('#iframe_id body')

alexa-lol ::

ne dela :(
naredim iframe in mu dam id
naredi = function () {
				$('body').append('<iframe>');
				$('iframe').attr('id','iframeID');
			}


potem imam pa za dodajanje vsebina v body od iframe z idjem iframeID v drugi funkciji, ki jo aktivira gumb
var formHTML = '<form action="" method="post">'+
				'<input type="hidden" name="filename" />'+
				'<input type="hidden" name="content" />'+
				'</form>';
				
								

				$('#iframeID body').append(formHTML);


a body ostane prazen

?

Gandalfar ::

A to ti po kaksnem tutorialu delas? :)

Zakaj pa ne uporabis recimo http://www.uploadify.com/ ce ze vztrajas na tej tehniki? :)

alexa-lol ::

nope.. :)

prvi cilj je, da bi s klikom sprožil funkcijo, ki bi sprožila file download. Skripto in tutorial mi je našel Tody ampak morem tisto stvar nekako na jQuery 1.4 prevesti, ker tam kjer jo rabim 1.6 ne dela.

In find('body') ne dela v 1.4; find($('body')) sicer dela a pripne vsebino k ta glavnemu body ne tistemu pri iframe.

Torej prvi cilj je download oz. najti način kako bi k iframu pripel form.

A bi bila možnost, da bi jaz ta form kr v kodo ze na zacetku dal in bi mu dal nek id, potem bi pa samo ta form spremenil in klical submit?

oz. isto vprašanje iz druge strani... zakaj sploh dati form v iframe?

Zgodovina sprememb…

Gandalfar ::

> oz. isto vprašanje iz druge strani... zakaj sploh dati form v iframe?

To sem tudi jaz spraseval - od tu vprasanje glede tutoriala ;)

Formo delas tako, da das file input field notri in potem s POST submitas na server, kjer to sprocesiras. Nobene jQuery magije ne rabis v resnici.

MrBrdo ::

Mislim da bi imelo lahko smisel dati formo v iframe, če je na isti glavni domeni (in npr. različni poddomeni), potem lahko komuniciraš z iframe. Samo ne vem če ma to veze pri formi, vem da se včasih uporablja za AJAX na drugo poddomeno. V drugih primerih pa pomoje nima veze.
Drugače pa nism čisto poštekal kaj delaš, tko da se opravičujem če to kar sem napisal nima veze.
MrBrdo

Zgodovina sprememb…

  • spremenilo: MrBrdo ()

alexa-lol ::

Kaj zelim...

na strani je button z dolocenim idjem. Ko bi ga kliknil zelim, da bi pobral vsebino iz div taga z id="nekID" in potem to posredovati serverju (PHP), tam bi se to obdelalo in potem bi se uporabniku odprl Save File Dialog, kjer bi lahko shranil to. Pri tem ne želim, da se stran refresha oz. preusmeri.

Kako bi to najlažje dosegel?

Gandalfar ::

z jquery naredis .ajax() post na server, v success callbacku preberes naslov na katerega preusmeris brskalnik, ki ima pravi mimetype. Ker bo tvoj mimetype binary oz. download bo userju odprl download request, site bo pa se ostal viden.

MrBrdo ::

Tako kot pravi Gandalfar, lahko pa namesto ajax klica uporabiš tudi formo, tukaj je vseeno (v tem primeru ne rabiš redirecta, ampak direktno vrneš file). Za to da bo stran ostala vidna si pa poglej recimo tole: http://www.ryboe.com/tutorials/php-head... (to je to o čemer je Gandalfar govoril).
MrBrdo

alexa-lol ::

Zelo napredni predlogi :D)

Sem šel od začetka... in spisal tole
<html>
	<head>
		<script src="jquery.js"></script>
		<script type="text/javascript">
			addIframe = function() {
				$('body').append('<iframe>');
			}
			
			appendIframe = function() {
				var html = '<form action="download.php" method="post">'+
							'<input type="hidden" name="filename.txt" />'+
							'<input type="hidden" name="content123456" />'+
							'</form>';
							
				$('iframe').contents().find('body').append(html);
				//$('iframe').contents().find($('body')).last().append('appended');
				//var number = $('iframe').contents().length;
				//alert(number);
				
				//$('iframe').contents().find('form').submit();
			}
			
			submit = function() {
				$('iframe').contents().find('form').submit();
			}
		</script>
	</head>
	
	<body>
		<button onClick="javascript:addIframe();">addIframe</button>
		<button onClick="javascript:appendIframe();">appendIframe</button>
		<button onClick="javascript:submit();">Submit</button>
	</body>
</html>


In zadeva dela(čudež) tudi s jQ 1.4.2 ...

Sem pa odkril zanimivost koda deluje... ko pa klicem submit se cel iframe zbrise (samo iframe, head, body tagi ostanejo).. zakaj?


je mogoče kaj narobe s submitanjem?

Zgodovina sprememb…

Gandalfar ::

Ko submitas formo .. dobis nazaj tisto kar tvoj download.php vrne potem, ko se mu poslje datoteka. Ocitno ne vrnes nic :)

alexa-lol ::

saj dela :)
v input sem namesto, da bi dodal se atribut value in tam vsebino, vsebino vtaknil kar v name.

Sedaj dela razen še majhne težave...

rabil bi kombinacijo metode .html in .text...
Gre za to, da poiščem div z določenim id in bi rad dobil celoten html, ki je znotraj taga. Text vrne samo vsebino vseh potomcev, html pa samo html tega elementa s tem id in nič notranjosti.

kako bi to rešil ?
lep pozdrav :D

alexa-lol ::

oh ja... sem rešil z navadnim JS (getElementById).. problem pa dela
"

Sem dal string.replace a zamenja samo en
"
za
'
.. zato sem dal v for zanko pa
i<25000
da zihr use zamenja.

Zdaj zadeva končno dela :D Lp

alexa-lol ::

hej :D spet imam z jQuery nek problem
<div id="id1">
<h2 class="title">Nek naslov</h2>
</div>


kako bi dobil ven Nek naslov (kot string)
Problem je, da more bit id1 oče in zato $(".title") ne gre

Lp in hvala

Gandalfar ::

$('#id1').find('.title').text()

alexa-lol ::

Big thank you :D

Gandalfar ::

To je bil sicer grd query. Lepsi bi bil:

$('#id1 .title') :)

alexa-lol ::

:)

imam pa spet problem..
<div class="podatki">
<div class="podatek" id="podatek1" value="neka vrednost1"> ... </div>
...
</div>


Kako bi dobil ven neka vrednost1?

Ideja je taka (ne deluje)

arr =  $('.podatki').find('.podatek');
for(var i in arr){
				alert(arr[i].attr('value'));
			}


Kako bi to razrešil?

MrBrdo ::

$(".podatki .podatek").each(function() { alert($(this).attr("value"); });

pri tvoji rešitvi pa verjetno manjka namesto arr[i] $(arr[i])
MrBrdo

alexa-lol ::

to je manjkalo ja .. hvala :D

MrBrdo ::

Upoštevaj kaj je Gandalfar prej rekel btw... Brezveze delaš .find ker lahko v enem selectorju vse narediš, tako kot sem tudi jaz naredil...
MrBrdo

alexa-lol ::

bom upošteval :D
zanima me kako bi downloadal file, ki se nahaja na disku od serverja s PHP? Na način, da bi uporabnik kliknil download in bi se ta file zacel downloadati?

Zgodovina sprememb…

Gandalfar ::

Tako da nastavis na serverju pravi header za ta file :)

http://www.ryboe.com/tutorials/php-head...

alexa-lol ::

aha bom probal.. imam spet problem :D

PHPExcel
header('Content-Disposition: attachment; filename="' . $filename . '"');
$objWriter->save('uploads/test.xlsx');


Prva vrstica sproži file download in ta file je poškodovan (kar ena vsebina), dočim druga vrstica shrani ta file in ga lepo lahko odpiram. Kaj je fora?

MrBrdo ::

lol... dej, malo pogooglaj no :) če sam header nastaviš še ne pomeni da si poslal kaj.
MrBrdo

alexa-lol ::

evo sem pogledal se mal primere, ki jih imajo na strani (PHP Excel) in prišel do tega
header('Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
header('Content-Disposition: attachment;filename="' . $filename . '"');
header('Cache-Control: max-age=0');

$objWriter = PHPExcel_IOFactory::createWriter($objPHPExcel, 'Excel2007');
$objWriter->save('php://output');
exit;


Koda na srečo deluje :D

Zanima pa me če je kaj takega zvedljivo.. JS listener
Server vrne vrednost v iframeu..
<div id="nekId" value="abc" />

Ko jo vrne želim pognati določeno funckijo ampak le če je kaj v atributu value
When $('#nekId').attr('value')!='' Then KODA

Lp in hvala

Zgodovina sprememb…

MrBrdo ::

Zakaj v iframu? Uporabi AJAX.
MrBrdo

alexa-lol ::

bom :D

sem ugotovil, da če pošlješ
<script>alert(1223);</script>

se le ta izvede, tako, da bi se mogla izvesti utdi katerakoli druga funkcija katero klices

Gandalfar ::

ce si na isti domeni ja. Drugace te bo pa cross-domain ustavil.

MrBrdo ::

Če hočeš skripte vračat iz strežnika preko AJAXa http://api.jquery.com/jQuery.getScript/
MrBrdo


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
»

Jquery

Oddelek: Izdelava spletišč
151351 (1075) mk818764
»

jquery in div-i (strani: 1 2 )

Oddelek: Izdelava spletišč
878722 (7460) lisjak
»

Login popup box login error.

Oddelek: Programiranje
9906 (794) usoban
»

JavaScript offsetTop in brskalniki

Oddelek: Izdelava spletišč
8728 (660) shorvat
»

linkanje med div-i?

Oddelek: Izdelava spletišč
141355 (1173) MrBrdo

Več podobnih tem