Hämta länk från ett filfält...

16 svar · 622 visningar · startad av oskars 10 maj 2006

oskarsMedlem sedan nov. 20051 317 inlägg

Frågan10 maj 2006 13:47#1

Hej på er,

ja nu ska jag försöka förklara vad jag vill åstadkomma!

Jag har ett "filfält" där man kan klicka på bläddra och välja en bildfil. När man klickat på "Öppna" och valt bilden så får man ju en sökväg till bildfilen i sitt fält brevid "Bläddra"-knappen. Jag vill på något sätt få ha en länk brevid den här som ser ut så här:

Hur kan jag få tag i sökvägen i bilden i filfältet?

Tacksam för svar! :bire

oskarsMedlem sedan nov. 20051 317 inlägg

10 maj 2006 15:03#2

Det är alltså sökvägen till bilden på DATORN som jag vill ha fram i ahref-länken :)

nitro2k01Medlem sedan aug. 20039 340 inlägg

10 maj 2006 16:22#3

document.getElementsById("lankensid").href=
    document.forms["formnamnet"].elements["uploadensnamn"].value;

Vet dock inte hur det funkar med säkerhetsinställningar osv, men det bör gå bra.

antipentAMedlem sedan maj 2006296 inlägg

10 maj 2006 16:26#4

nitro: Det där ger väl bara filnamnet, inte sökvägen?

nitro2k01Medlem sedan aug. 20039 340 inlägg

10 maj 2006 16:30#5

antipentA skrev:

nitro: Det där ger väl bara filnamnet, inte sökvägen?

Nej, det ger hela sökvägen.

oskarsMedlem sedan nov. 20051 317 inlägg

10 maj 2006 17:31#6

nitro. fint! Tack! Glömde säga att jag har 20st olika filfält och behöver en till varje :) Hur ser hela koden ut för det där? Ska jag lägga det i en .js-fil och isf hur kallar jag på den i länken? *grubblar*

oskarsMedlem sedan nov. 20051 317 inlägg

11 maj 2006 09:36#7

Fälten heter så här:

file01
file02
file03
file04
file05
osv

oskarsMedlem sedan nov. 20051 317 inlägg

12 maj 2006 16:48#8

Okej, jag vet inte hur man använder nitro2ks script... men jag har fått några förslag här:

<html>
<head>
<script>
function changeField() {
var ett = document.test.ett.value;
document.test.tva.value = ett;
}
</script>
</head>
<body>
<form name="test">
<input type="file" name="ett" id="ett" onchange="changeField()">
<br /><br />
<input type="submit" id="tva" name="tva" style="border:0;width:100%;">
</form>
</body>
</html>

Det här är ganska intressant, det fungerar utmärkt lokalt på hårddisken, men inte online... någon som kan fatta varför och hur åtgärdar man detta? Alltså detta:

		<script type="text/javascript">
    	<!--

        function  visa()
        {
            var url = document.form.url.value
			 myWindow = window.open(url, "förhandsgransking", 'toolbar,width=600,height=600')

        }

        -->
    	</script>

    	<a href="javascript:visa()">visa</a>

    	<form name="form">

    	<input type="file" name="url">

    	</form>

Tacksam för svar! :stud

nitro2k01Medlem sedan aug. 20039 340 inlägg

12 maj 2006 18:43#9

<html>
<head>

<script type="text/javascript"><!--

function fixFileURL(instring){
	return "file:///"+encodeURI(instring.replace(/\\/g, "/"));
}

function cycleinputs(){
	var totalinputs = emptyinputs = 0, els = document.forms["tehform"].elements;

	for (var i=0; i<els.length; i++)
		if (els[i].type=="file"){
			var fname=fixFileURL(els[i].value);

			els[i].onchange=cycleinputs;

			totalinputs++;

			if(!els[i].value)
				emptyinputs++;
			else{
				if (null !== els[i].nextSibling && els[i].nextSibling.tagName=="A"){
					els[i].nextSibling.href = fixFileURL(els[i].value);
					els[i].nextSibling.replaceChild(document.createTextNode(fixFileURL(els[i].value)), els[i].nextSibling.firstChild);
				}else{
					var tempel = document.createElement("A")
					tempel.target="_blank";
					tempel.href = fixFileURL(els[i].value);
					tempel.appendChild(document.createTextNode(fixFileURL(els[i].value)));
					els[i].parentNode.appendChild(tempel);
				}
			}

		}

	if (emptyinputs==0){
		var tempel=document.createElement("DIV"),
			tempel2=document.createElement("INPUT");

		tempel2.type = "file";
		tempel2.name = "file" + totalinputs;

		tempel.appendChild(tempel2);

	 	document.getElementById("filecontainer").appendChild(tempel);

	 	tempel2.onchange=cycleinputs;
	}
}

window.onload=cycleinputs;

--></script>
</head>
<body>

<form name="tehform">

<div id="filecontainer">
	<div><input type="file" name="file0" /></div>
	<div><input type="file" name="file1" /></div>
	<div><input type="file" name="file2" /></div>

</div>
</form>

</body>
</html>

Problemet du upplever när du laddar upp sidan beror på att säkerhetsinställningarna inte tillåter window.open att hantera lokala URL'er.

oskarsMedlem sedan nov. 20051 317 inlägg

12 maj 2006 21:19#10

nitro, det scriptet som du bifogade, ska det fungera korrekt menar du? =)

nitro2k01Medlem sedan aug. 20039 340 inlägg

13 maj 2006 07:57#11

Pröva, det är det enda sättet att få veta.

oskarsMedlem sedan nov. 20051 317 inlägg

13 maj 2006 14:03#12

hej nitro, jo jag gjorde det faktiskt =) det fungerade inte i IE, men fungerade i FF... Vad är det som inte kan stödjas av IE där egentligen?

nitro2k01Medlem sedan aug. 20039 340 inlägg

14 maj 2006 09:16#13

oskars skrev:

hej nitro, jo jag gjorde det faktiskt =) det fungerade inte i IE, men fungerade i FF... Vad är det som inte kan stödjas av IE där egentligen?

Körde du det lokalt eller på en server?

oskarsMedlem sedan nov. 20051 317 inlägg

14 maj 2006 17:54#14

både och =)

nitro2k01Medlem sedan aug. 20039 340 inlägg

14 maj 2006 20:21#15

Aha, det verkar ha med säkerhetsinställningar att göra. Men får jag fråga, vad ska du använda det till?

oskarsMedlem sedan nov. 20051 317 inlägg

15 maj 2006 04:29#16

Jo som sagt.

Jag har 20st filfält som jag laddar upp bilder med. Jag vill innan jag laddar upp bilderna kunna förhandskolla bilderna innan jag laddar upp dom på ett enkelt sätt... Alltså vill jag ha en länk till vänster om filfälten som länkar till bilderna lokalt på datorn. Visst, det går ju att bara gå in i bildernas mapp, men det här skulle vara 100 gånger smidiare.

Så här kommer det se ut:

01 [filfält] [bläddra-knapp]
02 [filfält] [bläddra-knapp]
03 [filfält] [bläddra-knapp]
04 [filfält] [bläddra-knapp]
05 [filfält] [bläddra-knapp]

Där 01-05 är preview-knappar. Notera att det ska vara 20st såna här fält!

Tack för att du tar dig tid!

oskarsMedlem sedan nov. 20051 317 inlägg

15 maj 2006 10:25#17

Jag har gjort lite efterforskningar och hittat detta scriptet som fungerar bra, men behöver lite modifikationer:


<HEAD>

<script type="text/javascript">
  // width to resize large images to
var maxWidth=100;
  // height to resize large images to
var maxHeight=200;
  // valid file types
var fileTypes=["bmp","gif","png","jpg","jpeg"];
  // the id of the preview image tag
var outImage="previewField";
  // what to display when the image is not valid
var defaultPic="spacer.gif";

/***** DO NOT EDIT BELOW *****/

function preview(what){
  var source=what.value;
  var ext=source.substring(source.lastIndexOf(".")+1,source.length).toLowerCase();
  for (var i=0; i<fileTypes.length; i++) if (fileTypes[i]==ext) break;
  globalPic=new Image();
  if (i<fileTypes.length) globalPic.src=source;

  setTimeout("applyChanges()",200);
}
var globalPic;
function applyChanges(){
  var field=document.getElementById(outImage);
  var x=parseInt(globalPic.width);
  var y=parseInt(globalPic.height);
  if (x>maxWidth) {
    y*=maxWidth/x;
    x=maxWidth;
  }
  if (y>maxHeight) {
    x*=maxHeight/y;
    y=maxHeight;
  }
  field.style.display=(x<1 || y<1)?"none":"";
  field.src=globalPic.src;
  field.width=x;
  field.height=y;
}
// End -->
</script>
</HEAD>

<BODY>

<div align="center" style="line-height: 1.9em;">
<br>
<input type="file" id="picField" onchange="preview(this)" onClick="preview(this)"><br />
<input type="file" id="picField" onchange="preview(this)" onClick="preview(this)"><br />
<input type="file" id="picField" onchange="preview(this)" onClick="preview(this)"><br />
<input type="file" id="picField" onchange="preview(this)" onClick="preview(this)"><br />
<br>
<img alt="preview here" id="previewField" src="spacer.gif">

</body>

Det är perfekt. Det enda som inte fungerar som det ska är det här:

När man valt 1st fil i ett filfält och ska välja fil i nästa filfält... när man klickar på bläddra i filfält nr2 så försvinner bild1 under tiden man väljer bild2.. förstår du? det är lite irreterande eftersom layouten hoppar och förvirrar på min sida.

Är det något du kan modifiera åt mig? För i så fall har jag mitt script färdigt :)

:birp