Avatar billede nythjem Nybegynder
03. april 2004 - 18:50 Der er 7 kommentarer og
2 løsninger

Overfør værdi fra select til to dokumenter..

Hej Alle!

Jeg har rodet mig ud i et, for mig, meget avanceret javascript problem.

http://www.nythjem.dk/problem.jpg

Som I kan se har jeg en fil, hvori der er to iframes.

- I den ene iframe har jeg en select boks, der sender valuen af boksen til den anden iframe. Det virker.
- I hoveddokumentet har jeg en tekst boks, der hedder "msg2".

Der er to ting, jeg ikke kan finde ud af.

# Når jeg markerer en value i selectboksen i iframen, skal jeg sende værdien til både hoveddokumentets tekstboks "msg2" samt den anden iframe.

## I den anden iframe, hvor værdien kommer over fra select boksen hentes den i en tekst boks. Er der nogen måde, jeg kan få den værdi, så jeg kan arbejde med den, og eventuelt lave <img src="værdien">?


//////////////// HOVED DOKUMENT ///////////////////////

<!-- based on insimage.dlg -->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD W3 HTML 3.2//EN">
<HTML  id=dlgImage STYLE="width: 765px; height: 630px; ">
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="MSThemeCompatible" content="Yes">
<TITLE>Insert Image</TITLE>
<link rel="stylesheet" type="text/css" href="../css/style.css">

<script language="JavaScript">
<!-- Begin
function passText(str) {
top.frames['right'].document.yourform.msg.value = str;
}
// End -->
</script>

<style>
  html, body, button, div, input, select, fieldset { font-family: MS Shell Dlg; font-size: 8pt; position: absolute; };
</style>
<SCRIPT defer>

function _CloseOnEsc() {
  if (event.keyCode == 27) { window.close(); return; }
}

function _getTextRange(elm) {
  var r = elm.parentTextEdit.createTextRange();
  r.moveToElementText(elm);
  return r;
}

window.onerror = HandleError

function HandleError(message, url, line) {
  var str = "An error has occurred in this dialog." + "\n\n"
  + "Error: " + line + "\n" + message;
  alert(str);
  window.close();
  return true;
}

function Init() {
  var elmSelectedImage;
  var htmlSelectionControl = "Control";
  var globalDoc = window.dialogArguments;
  var grngMaster = globalDoc.selection.createRange();
 
  // event handlers 
  document.body.onkeypress = _CloseOnEsc;
  btnOK.onclick = new Function("btnOKClick()");

  txtFileName.fImageLoaded = false;
  txtFileName.intImageWidth = 0;
  txtFileName.intImageHeight = 0;

  if (globalDoc.selection.type == htmlSelectionControl) {
    if (grngMaster.length == 1) {
      elmSelectedImage = grngMaster.item(0);
      if (elmSelectedImage.tagName == "IMG") {
        txtFileName.fImageLoaded = true;
        if (elmSelectedImage.src) {
          txtFileName.value          = elmSelectedImage.src.replace(/^[^*]*(\*\*\*)/, "$1");  // fix placeholder src values that editor converted to abs paths
          txtFileName.intImageHeight = elmSelectedImage.height;
          txtFileName.intImageWidth  = elmSelectedImage.width;
          txtVertical.value          = elmSelectedImage.vspace;
          txtHorizontal.value        = elmSelectedImage.hspace;
          txtBorder.value            = elmSelectedImage.border;
          txtAltText.value          = elmSelectedImage.alt;
          selAlignment.value        = elmSelectedImage.align;
        }
      }
    }
  }
  txtFileName.value = txtFileName.value || "http://";
  txtFileName.focus();
}

function _isValidNumber(txtBox) {
  var val = parseInt(txtBox);
  if (isNaN(val) || val < 0 || val > 999) { return false; }
  return true;
}

function btnOKClick() {
  var elmImage;
  var intAlignment;
  var htmlSelectionControl = "Control";
  var globalDoc = window.dialogArguments;
  var grngMaster = globalDoc.selection.createRange();
 
  // error checking

  if (!txtFileName.value || txtFileName.value == "http://") {
    alert("Image URL must be specified.");
    txtFileName.focus();
    return;
  }
  if (txtHorizontal.value && !_isValidNumber(txtHorizontal.value)) {
    alert("Horizontal spacing must be a number between 0 and 999.");
    txtHorizontal.focus();
    return;
  }
  if (txtBorder.value && !_isValidNumber(txtBorder.value)) {
    alert("Border thickness must be a number between 0 and 999.");
    txtBorder.focus();
    return;
  }
  if (txtVertical.value && !_isValidNumber(txtVertical.value)) {
    alert("Vertical spacing must be a number between 0 and 999.");
    txtVertical.focus();
    return;
  }

  // delete selected content and replace with image
  if (globalDoc.selection.type == htmlSelectionControl && !txtFileName.fImageLoaded) {
    grngMaster.execCommand('Delete');
    grngMaster = globalDoc.selection.createRange();
  }
   
  idstr = "\" id=\"556e697175657e537472696e67";    // new image creation ID
  if (!txtFileName.fImageLoaded) {
    grngMaster.execCommand("InsertImage", false, idstr);
    elmImage = globalDoc.all['556e697175657e537472696e67'];
    elmImage.removeAttribute("id");
    elmImage.removeAttribute("src");
    grngMaster.moveStart("character", -1);
  } else {
    elmImage = grngMaster.item(0);
    if (elmImage.src != txtFileName.value) {
      grngMaster.execCommand('Delete');
      grngMaster = globalDoc.selection.createRange();
      grngMaster.execCommand("InsertImage", false, idstr);
      elmImage = globalDoc.all['556e697175657e537472696e67'];
      elmImage.removeAttribute("id");
      elmImage.removeAttribute("src");
      grngMaster.moveStart("character", -1);
      txtFileName.fImageLoaded = false;
    }
    grngMaster = _getTextRange(elmImage);
  }

  if (txtFileName.fImageLoaded) {
    elmImage.style.width = txtFileName.intImageWidth;
    elmImage.style.height = txtFileName.intImageHeight;
  }

  if (txtFileName.value.length > 2040) {
    txtFileName.value = txtFileName.value.substring(0,2040);
  }
 
  elmImage.src = txtFileName.value;
 
  if (txtHorizontal.value != "") { elmImage.hspace = parseInt(txtHorizontal.value); }
  else                          { elmImage.hspace = 0; }

  if (txtVertical.value != "") { elmImage.vspace = parseInt(txtVertical.value); }
  else                        { elmImage.vspace = 0; }
 
  elmImage.alt = txtAltText.value;

  if (txtBorder.value != "") { elmImage.border = parseInt(txtBorder.value); }
  else                      { elmImage.border = 0; }

  elmImage.align = selAlignment.value;
  grngMaster.collapse(false);
  grngMaster.select();
  window.close();
}
</SCRIPT>
</HEAD>
<BODY id=bdy onload="Init()" topmargin="0" leftmargin="0" background="../gfx/uploadbaggrund.jpg" style="color: windowtext;" scroll=no>

<DIV id=divFileName style="left: 400px; top: 350px; width: 7em; height: 1.7em; ">Image URL:</DIV>
<INPUT ID=txtFileName type=text name="msg2" style="left: 500px; top: 350px; width: 18em;height: 1.7em; " tabIndex=10 onfocus="select()">

<DIV id=divAltText style="left: 400px; top: 380px; width: 6.58em; height: 1.7em; ">Alternate Text:</DIV>
<INPUT type=text ID=txtAltText tabIndex=15 style="left: 500px; top: 380px; width: 18em; height: 1.7em; " onfocus="select()">

<DIV id=divAlign style="left: 400px; top: 410px; width: 4.76em; height: 1.2168em; ">Alignment:</DIV>
<SELECT size=1 ID=selAlignment tabIndex=20 style="left: 500px; top: 410px; width: 18em; height: 1.2168em; ">
<OPTION id=optNotSet value=""> Not set </OPTION>
<OPTION id=optLeft value=left> Left </OPTION>
<OPTION id=optRight value=right> Right </OPTION>
<OPTION id=optTexttop value=textTop> Texttop </OPTION>
<OPTION id=optAbsMiddle value=absMiddle> Absmiddle </OPTION>
<OPTION id=optBaseline value=baseline SELECTED> Baseline </OPTION>
<OPTION id=optAbsBottom value=absBottom> Absbottom </OPTION>
<OPTION id=optBottom value=bottom> Bottom </OPTION>
<OPTION id=optMiddle value=middle> Middle </OPTION>
<OPTION id=optTop value=top> Top </OPTION>
</SELECT>

<DIV id=divHoriz style="left: 400px; top: 440px; width: 4.76em; height: 1.7em; ">Horizontal:</DIV>
<INPUT ID=txtHorizontal style="left: 500px; top: 440px; width: 4.2em; height: 1.7em; ime-mode: disabled;" type=text size=3 maxlength=3 value="" tabIndex=25 onfocus="select()">

<DIV id=divVert style="left: 400px; top: 470px; width: 3.64em; height: 1.7em; ">Vertical:</DIV>
<INPUT ID=txtVertical style="left: 500px; top: 470px; width: 4.2em; height: 1.7em; ime-mode: disabled;" type=text size=3 maxlength=3 value="" tabIndex=30 onfocus="select()">

<DIV id=divBorder style="left: 400px; top: 500px; width: 8.12em; height: 1.7em; ">Border Thickness:</DIV>
<INPUT ID=txtBorder style="left: 500px; top: 500px; width: 6.72em; height: 1.7em; ime-mode: disabled;" type=text size=3 maxlength=3 value="" tabIndex=21 onfocus="select()">

<BUTTON ID=btnOK style="left: 620px; top: 540px; width: 7em; height: 2em; " type=submit tabIndex=40>OK</BUTTON>
<BUTTON ID=btnCancel style="left: 540px; top: 540px; width: 7em; height: 2em; " type=reset tabIndex=45 onClick="window.close();">Cancel</BUTTON>

<DIV style="left: 400px; top: 120px; width: 315px; height: 180px; "><iframe id="right" name="right" border="0" width="315" height="180px" marginWidth="0" marginHeight="0" src="eksempel.asp" frameBorder="0"></iframe></DIV>

<DIV style="left: 40px; top: 120px; width: 315px; height: 400px; "><iframe id="upse" name="upse" ALLOWTRANSPARENCY="true" border="0" width="315" height="400px" scrolling="no" marginWidth="0" marginHeight="0" src="upload.asp" frameBorder="0"></iframe></DIV>

</BODY>
</HTML>

//////////////// IFRAME MED SELECT BOX ///////////////////////


<form name=myform>
<select MULTIPLE size="5" style="width:315;height:275; font-family:Verdana, Arial, Helvetica; font-size:10px" name="site">

<option value="billeder/" & g_oFile.name & "">" & g_oFile.name & "</option>"

</select>
<input type="button" value="VIS EKSEMPEL PÅ BILLEDE" onClick="parent.passText(this.form.site.options[this.form.site.selectedIndex].value);">


//////////////// IFRAME DER MODTAGER VÆRDI ///////////////////////

<html>
<head>
<title>eksempel</title>

</head>


<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<form name=yourform>
<input type=text name=msg size=35 value="">
</form>

</table>

</body>

</html>
Avatar billede roenving Novice
03. april 2004 - 18:57 #1
function passText(str) {
top.frames['right'].document.yourform.msg.value = str;
document.getElementById('txtFileName').value=str;
}
Avatar billede roenving Novice
03. april 2004 - 19:01 #2
Og-eh, 200 points ?-)

Hvis vi nu medtager 7 scrolls à 2-5 ekstra-points og at du har lagt over 200 linjer for meget, når vi vist op i nærheden af et mellem-spørgsmål ...

Og der kan sagtens lægges en linje mere, som f.eks.

top.frames['right'].document.images['ditBillede'].src=str;
Avatar billede nythjem Nybegynder
03. april 2004 - 19:07 #3
Hmm Jes..

Nu ved jeg godt, at du sikker er møgdyr, men jeg har det efterhånden dårligt med, at bruge dig i så vid udstrækning, og ikke aflønne dig *Gg* Hvor kan man købe din tid? Firma? :)

Håber du gider hjælpe mig med to bigges til, måske..

Den her: top.frames['right'].document.images['ditBillede'].src=str;, hvordan fanger jeg den i "den anden frame", så eksemplet bliver vist?

Og til sidst, er det måske muligt, at lave en autoform, så man ikke skal trykke på "Vis eksempel" knappen?
Avatar billede roenving Novice
03. april 2004 - 19:22 #4
Hvis du har et img-tag med name="ditBillede" vil billedet skifte, når den linje udføres ...

Ja, da:

<select style="width:315;height:275; font-family:Verdana, Arial, Helvetica; font-size:10px" name="site" onchange="if(this.selectedIndex>0)parent.passText(this.value)">
<option value="">-- Vælg Billede --</option>


<option value=""billeder/" & g_oFile.name & """>" & g_oFile.name & "</option>"

-- bemærk at jeg lige satte "" på value-propertyen, det er smart at have med (og fremtidssikret, da xhtml forlanger den slags !-)
Avatar billede nythjem Nybegynder
03. april 2004 - 19:30 #5
Ja ja ja, du er jo ikke mindre end genial :)

Tusinde tusinde tusinde tak skal du have Jes :)
Avatar billede roenving Novice
03. april 2004 - 19:48 #6
Tjah, det med genialiteten kan vist her ligge på et meget lille sted ...

-- men jeg er i hvert fald ikke så forkalket, at jeg ikke kan huske, hvordan jeg gjorde de 3 gange i går, hvor nogen havde brug for det samme !-)

-- og BEHOLD SÅ de fleste af pointene selv !!!! Købmanden tager alligevel ikke imod dem !-)

-- ellers velbekomme '-)
Avatar billede nythjem Nybegynder
03. april 2004 - 19:56 #7
: )

Har lige et sidste :) Jeg vil lave en popup også, så man kan se "for store billeder", men den vil ikke helt acceptere..

top.frames['right'].document.link['links'].href=str;

Og tak Jes, jeg deler, så og håber jeg du får en særdeles god lørdag aften og søndag..
Avatar billede roenving Novice
03. april 2004 - 20:02 #8
Hvad er .link ?-)

-- og jeg tror du skal ind på den, som jeg har på min side, hvis du skal åbne store billeder:

http://roenving.users.whitehat.dk/WD1ResizeTilBillede.html

-- og tak for points ;~}
Avatar billede nythjem Nybegynder
03. april 2004 - 20:06 #9
Der er mig der takker :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Seneste spørgsmål Seneste aktivitet
I går 10:21 Ny printer, men hvilken Af mort1 i Printere
13/0819:41 USB på Linux Af Uvanga i Linux
12/0818:26 Hvilken type mus Af mort1 i PC
11/0813:21 ms Forms Af leahcim i Andet software
10/0821:30 Blokeret på Snapchat? Af LineP i Chat & Messaging