HTML/CSS/JavaScript

[Martin]

eddie schreef op 19-11-2003 @ 09:11:
ik zei volgens mij niet dat je een submit-button moest gebruiken

Ik moet het formulier toch submitten om de afbeelding te kunnen uploaden=

Martin schreef op 19-11-2003 @ 13:08:
Ik moet het formulier toch submitten om de afbeelding te kunnen uploaden=

dat kan ook via javascript (sterker nog: dat was mijn bedoeling)...

[Martin]

eddie schreef op 19-11-2003 @ 13:39:
dat kan ook via javascript (sterker nog: dat was mijn bedoeling)...

Hmm, maar is het niet net zo makkelijk om eerst het bestand te uploaden, en indien dit succesvol is geweest een javascriptje uitspugen in de pop-up die de var +url+ in het textarea stopt en het huidige venster sluit d.m.v. window.close?

(Mijn javascript kennis is echt slecht, sorry )

Martin schreef op 19-11-2003 @ 15:20:
Hmm, maar is het niet net zo makkelijk om eerst het bestand te uploaden, en indien dit succesvol is geweest een javascriptje uitspugen in de pop-up die de var +url+ in het textarea stopt en het huidige venster sluit d.m.v. window.close?

(Mijn javascript kennis is echt slecht, sorry )

Ja.
Maar dat submitten moet je dus ook in de functie doen

Dus:

<script language="text/javascript">
function laad_op()
{
  document.forms['form_laad_op'].submit();
}
</script>
...form declaratie enzo...
<input type="button" onclick="laad_op()" value="Laad op" />

[Martin]

eddie schreef op 19-11-2003 @ 15:33:
Ja.
Maar dat submitten moet je dus ook in de functie doen

Dus:

<script language="text/javascript">
function laad_op()
{
  document.forms['form_laad_op'].submit();
}
</script>
...form declaratie enzo...
<input type="button" onclick="laad_op()" value="Laad op" />

Dan zou dit dus moeten werken:

<script language="text/javascript">
function laad_op(url)
{
  document.forms['form_laad_op'].submit();
}
</script>
...form declaratie enzo...
<input type="button" onclick="laad_op(de url hier)" value="Laad op" />

Maar hoe geef ik dan aan waar hij de tekst moet neergooien? (textarea heet htmlarea)

Martin schreef op 19-11-2003 @ 15:46:
Dan zou dit dus moeten werken:

<script language="text/javascript">
function laad_op(url)
{
  document.forms['form_laad_op'].submit();
}
</script>
...form declaratie enzo...
<input type="button" onclick="laad_op(de url hier)" value="Laad op" />

Maar hoe geef ik dan aan waar hij de tekst moet neergooien? (textarea heet htmlarea)

(ik probeer om niet de hele code erneer te zetten zodat je zelf ook nog wat leert )

Stap 1: Geeft je textarea een uniek ID mee

<textarea id="plaatje"></textarea>

Stap 2: In je popup, geef je form een uniek id. (uniek binnen het document)
Stap 3: Gebruik getElementById( elementid ) om het goede element te krijgen.
Stap 4: Gebruik het element bij stap 3 als een.... element

var formpje = docment.getElementById( 'form_upload' );
formpje.submit();

Maar het kan ook in een keer:

docment.getElementById( 'form_upload' ).submit();

Stap 5: Submit het form
Stap 6: Vul de textarea met de goede text (verkrijg de textarea dmv getElementById)
Stap 7: Sluit de popup.

[Martin]

eddie schreef op 19-11-2003 @ 16:01:
Stap 1: Geeft je textarea een uniek ID mee

<textarea id="plaatje"></textarea>

Done, textarea heet nu "cmsfield".

eddie schreef op 19-11-2003 @ 16:01:
Stap 2: In je popup, geef je form een uniek id. (uniek binnen het document)

PHP-code:

<form method="post" action="sendmedia.php" enctype="multipart/form-data" id="sendmediaform"> 


Zo?

eddie schreef op 19-11-2003 @ 16:01:
Stap 3: Gebruik getElementById( elementid ) om het goede element te krijgen.
Stap 4: Gebruik het element bij stap 3 als een.... element
*code*

Dus ik zet dit als javascript in de head:

PHP-code:

document.getElementById('cmsfield').submit(); 


eddie schreef op 19-11-2003 @ 16:01:
Stap 6: Vul de textarea met de goede text (verkrijg de textarea dmv getElementById)

Wat, waar hoe?

[M@rco]

Martin schreef op 19-11-2003 @ 18:07:
Wat, waar hoe?

Kijk eens naar dit voorbeeld:

<script type="text/javascript">
<!--
function fill(text)
{
document.getElementById('ta').innerHTML = text;
}
//-->
</script>

<a href="#" onclick="fill('Test!');">Klikkerdeklik</a>

<form id="bla">
<textarea id="ta" cols="30" name="ta" rows="3"></textarea>
</form>

[Martin]

M@rco schreef op 19-11-2003 @ 18:28:
Kijk eens naar dit voorbeeld:
*supercode*

Deze code snap ik, en deze werkt ook! Bedankt! Maar ik moet dus geen URL plakken in de popup maar in het onderliggende CMS-venster. Hoe doe ik dat dan?

[M@rco]

Martin schreef op 19-11-2003 @ 18:31:
Deze code snap ik, en deze werkt ook! Bedankt! Maar ik moet dus geen URL plakken in de popup maar in het onderliggende CMS-venster. Hoe doe ik dat dan?

Ervan uitgaande dat de URL die je wilt plakken ergens in een variable staat (noem hem hier ff "url"), zou je zoiets krijgen:

...
window.opener.document.getElementById('cmsfield').innerHTML = '&lt;img src="' + url + '" border="0" /&gt;';
self.close();

[Martin]

M@rco schreef op 19-11-2003 @ 18:54:
Ervan uitgaande dat de URL die je wilt plakken ergens in een variable staat (noem hem hier ff "url"), zou je zoiets krijgen:

...
window.opener.document.getElementById('cmsfield').innerHTML = '&lt;img src="' + url + '" border="0" /&gt;';
self.close();

Dat klopt, maar dan haalt hij alle tekst uit het textarea weg en zet er alleen het <img> gebeuren neer i.p.v. de <img> toe te voegen...

[M@rco]

Martin schreef op 19-11-2003 @ 18:56:
Dat klopt, maar dan haalt hij alle tekst uit het textarea weg en zet er alleen het <img> gebeuren neer i.p.v. de <img> toe te voegen...

Zo dan

window.opener.document.getElementById('cmsfield').innerHTML += '&lt;img src="' + url + '" border="0" /&gt;';

[Martin]

M@rco schreef op 19-11-2003 @ 19:11:
Zo dan

window.opener.document.getElementById('cmsfield').innerHTML += '&lt;img src="' + url + '" border="0" /&gt;';

Hij sluit zichzelf wel netjes, maar hij voegt niets toe aan het textarea....

Source:

PHP-code:

<?
// set some values
$path = "./uploads/"; 
$unique_filename = uniqid('pic',FALSE);
$file_extension = '.jpg';

// check if data is send
 if($_FILES["file"]){

    // move file to new destination
    move_uploaded_file($_FILES['file']['tmp_name'],$path.$unique_filename.$file_extension);
    
    // optional OK-message
    echo "Bestand is verstuurd!<br>";
    $url = './gfx/logo.jpg'; // for testing
?>
    <script type="text/javascript"> 
    <!-- 
    opener.document.getElementById('cmsfield').innerHTML += '&lt;img src="<? echo "$url"; ?>" border="0" &gt;';
    self.close(); 
    //--> 
    </script> 
<?
}
    else{
?>   
<form method="post" action="sendmedia.php" enctype="multipart/form-data" id="sendmediaform"> 
   <input type=hidden name=upload value=1>
   <input type=file name=file> 
   <input type=submit name=submit> 
</form> 
<?
    }
?>

En mijn editor.php:

PHP-code:

<textarea name="htmlSource" rows=20 cols=80 id="cmsfield">
<? echo "$result_content[code]"; ?>
</textarea>

[M@rco]

Martin schreef op 19-11-2003 @ 20:34:
Hij sluit zichzelf wel netjes, maar hij voegt niets toe aan het textarea....

Hmm... vreemd, want de vorige keer deed ie het wel

Ook window.opener geprobeerd (ipv 'opener)?

[Martin]

M@rco schreef op 19-11-2003 @ 21:25:
Ook window.opener geprobeerd (ipv 'opener)?

Jep, beide geprobeerd

[TIGEK]

Ik ben bezig met een nieuwe layout (De oude bleek een beetje gejat te wezen)
zit ik in de begin fase en elk begin is lastig

Ik werk standaard al met css en ik wil deze probleem ook daarmee oplossen

Voorbeeld: http://www.mol-clan.nl/indexnew.php (Zoals ik het niet wil hebben!!

.login{width:520px;
border-bottom:1px solid #7F7F7F;
border-left:1px solid #7F7F7F;
border-right:1px solid #7F7F7F;
height:15px
}

Dit is de bewuste css code. Deze code werkt wel en is goed maar alleen de heigth werkt voor geen tierelier.
Zoveer ik weet is deze declaratie wel toegestaan dus het zal moeten werken.
Graag een antwoord

Martin schreef op 19-11-2003 @ 18:07:

PHP-code:

<form method="post" action="sendmedia.php" enctype="multipart/form-data" id="sendmediaform"> 


Zo?

Ja

Martin schreef op 19-11-2003 @ 18:07:

Dus ik zet dit als javascript in de head:

PHP-code:

document.getElementById('cmsfield').submit(); 


Correct.

Martin schreef op 19-11-2003 @ 18:07:

Stap 6: Vul de textarea met de goede text (verkrijg de textarea dmv getElementById)
Wat, waar hoe?

Zie M@rco Maar je mag gewoon .value gebruiken in plaats van .innerHTML.

Het probleem wat jij hebt is dat je de url aan de server kant bepaald, nadat je javascript is geladen. Je moet in je javascript van tevoren weten waar je het wilt plaatsen.
Verder moet je geen submit button gebruiken, maar een standaard button waarop je op de onclick de javascript functie aanroept.

TIGEK schreef op 19-11-2003 @ 23:39:
Ik ben bezig met een nieuwe layout (De oude bleek een beetje gejat te wezen)
zit ik in de begin fase en elk begin is lastig

Ik werk standaard al met css en ik wil deze probleem ook daarmee oplossen

Voorbeeld: http://www.mol-clan.nl/indexnew.php (Zoals ik het niet wil hebben!!

.login{width:520px;
border-bottom:1px solid #7F7F7F;
border-left:1px solid #7F7F7F;
border-right:1px solid #7F7F7F;
height:15px
}

Dit is de bewuste css code. Deze code werkt wel en is goed maar alleen de heigth werkt voor geen tierelier.
Zoveer ik weet is deze declaratie wel toegestaan dus het zal moeten werken.
Graag een antwoord

Ik raad je aan om geen tabellen te gebruiken voor je layout. Zet allees over naar CSS en gebruik div's en span's voor de plaatsing van de teksten.

eddie schreef op 20-11-2003 @ 09:21:
Ik raad je aan om geen tabellen te gebruiken voor je layout. Zet allees over naar CSS en gebruik div's en span's voor de plaatsing van de teksten.

Ik gebruik alleen voor de body een tabel,
dit omdat MSIE niet goed met divs werkt (of het ligt aan mij :/),
Mozilla doet het al een stuk beter..

Maar als je iets wilt centreren doet hij dat niet zoals ik wil, ik kreeg steeds problemen als ik iets 100% hoog wil maken..

[TIGEK]

eddie schreef op 20-11-2003 @ 09:21:
Ik raad je aan om geen tabellen te gebruiken voor je layout. Zet allees over naar CSS en gebruik div's en span's voor de plaatsing van de teksten.

Hellaas is mijn website ongeveer even wisselvallig als het weer. Zelf de menu's met bepaalde gegevens worden allemaal uit een database of in ideregeval door php genereerd.
Ik heb het wel geprobeerd maar het werd er alleen maar slecter op. Ben bang dat het voor mij geen optie is. Misschien voor een wat statischer site.

[nienie]

Weet iemand hoe je zowel een background image (1x) kan weergeven en de rest van de pagina op kan vullen met een background color?

[Martin]

nienie schreef op 21-11-2003 @ 07:07:
Weet iemand hoe je zowel een background image (1x) kan weergeven en de rest van de pagina op kan vullen met een background color?

http://www.w3schools.com/css/css_background.asp

Ze-k-e-n

TIGEK schreef op 20-11-2003 @ 15:53:
Hellaas is mijn website ongeveer even wisselvallig als het weer. Zelf de menu's met bepaalde gegevens worden allemaal uit een database of in ideregeval door php genereerd.
Ik heb het wel geprobeerd maar het werd er alleen maar slecter op. Ben bang dat het voor mij geen optie is. Misschien voor een wat statischer site.

www.erikdokter.nl - ook gegenereerd, maar zonder tabellen. Dus layout gedaan met CSS.

eddie schreef op 21-11-2003 @ 08:57:
www.erikdokter.nl - ook gegenereerd, maar zonder tabellen. Dus layout gedaan met CSS.

ja, en daarom doe ik het dus niet..
Ziet er met MSIE anders uit dan FireBird..

********** schreef op 21-11-2003 @ 11:13:
ja, en daarom doe ik het dus niet..
Ziet er met MSIE anders uit dan FireBird..

*wijst naar de duizenden discussies over het naleven van de standaarden doe IE*

[mening]
Het is niet mijn probleem dat IE de laatste tijd niet vernieuwd is kwa standaarden.
[/mening]

[nienie]

Martin schreef op 21-11-2003 @ 07:23:
http://www.w3schools.com/css/css_background.asp

Ze-k-e-n

Sorry en bedankt

eddie schreef op 21-11-2003 @ 11:47:
*wijst naar de duizenden discussies over het naleven van de standaarden doe IE*

[mening]
Het is niet mijn probleem dat IE de laatste tijd niet vernieuwd is kwa standaarden.
[/mening]

Je kunt best zo denken,
ik ben het er ook mee eens..
Maar als je een grote website beheert, of een website voor een bedrijf kun je het niet maken dat het niet werkt voor MSIE gebruikers..

[RayMania]

Best wel een n00b-vraagje volgens mij maar ach ...

Ik wil op mijn site een balk maken (zie onder), en als je dan daar een link in typ (en Enter of op een button drukt), dat je dan naar die pagina gaat van die link (in hetzelfde venster).



Hoe zou ik dat kunnen maken?
Bvd...

met javascript
euh
<script>
function go()
{
document.location.href = url.input.value;
}
</script>

<form name='url' onsubmit='go()'>
<input type='text' name='input'>
<input type='submit'>
</form>

zo moet 't werken miss niet zo netjes maar dat doe ik wel als ik weer ncuther ben

[Kawouter]

Hoi,

Ik ben een website aan het maken en ik gebruik daarin enkele forms. Nu, voor ik deze forms in een database steek (allez ja, de ingevulde data) zou ik die graag willen nakijken en de tekens zoals > en < en ; enz vervangen door hun html-equivalenten. De data uit de form halen: geen probleem, de data controleren: geen probleem, maar hoe krijg ik nu in hemelsnaam die -gecontroleerde- data terug in dat form, of in mijn database ?

(Ik werk met Asp en javascript)

php -> htmlspecialchars()
asp -> zoek de variant?

[Kawouter]

Hoe ik de tekens moet vervangen weet ik, maar hoe krijg ik de aangepaste tekst terug in de 'form', of rechtstreeks in de database ?

(een ideetje kan al helpen, de code zelf kan ik eventueel nog wel proberen op te zoeken)

[RayMania]

Weet iemand nog mijn vraag, want met de code van eXo doet hij het niet.

RayMania schreef op 06-12-2003 @ 18:57:
Weet iemand nog mijn vraag, want met de code van eXo doet hij het niet.

nee, ik weet je vraag niet..

[plofke]

Heej vraagje (ben nu nog javascript n00b) maar daar wil ik verandering in brengen zit nu alleen nog met 1 probleempje.

Ik heb voor school nu een html gemaakt van 3 frames. Head, nav, body.

Nu moet de body telkens veranderen maar omdat ik de nav heb gemaakt met javascript weet ik die (tag) niet om hem naar die body te verwijzen.

De javascript code ...

var TREE_NODES = [
['Introductie', null, null,
['Wie zijn wij', 'wie.html', '_top'],
['Waar vindt u ons', 'waar.html', '_top'],
['Producten', null, null,
['Producten', 'producten.html', '_top'],


],
],
['Formulier', null, null,
['Vul dit in', 'form.html', '_top'],


]
];

Ik denk dat er iets moet toegevoegd worden bij deze regel:

['Wie zijn wij', 'wie.html', '_top'],

Wie kan mij effe verder helpen.

Waarom doe je dat in hemelsnaam met Javascript

[LB06]

Misschien een domme vraag, maar hoe centreer ik een DIV-element, zonder gebruik te maken van de deprecated <center> </center> tags? Ik wil de opmaak volledig in CSS gaan doen en naar de standaarden leven, maar als er zelfs geen goede vervanger is voor center...

body
{
	...
	text-align: center;
	...
}

Deze aangeraden methode mbv van CSS werkt ook niet. Wel voor text en images enzo, maar niet voor divs. <center> werkt wel voor divs.

Check de position property

[LB06]

Position? Welke attribute moet ik dan gebruiken????

http://www.w3.org/TR/1998/REC-CSS2-1...opdef-position

position: absolute; left: x%; right: x%; etc

[LB06]

Ja, maar dat komt op mij over als een slechte workaround. Als ik het venster verklein, wordt de div ook kleiner, en dat heb ik liever niet.

[LB06]

Misschien kan ik dat toch wel gebruiken, dan maak ik gewoon een 100% resolution independent site.

Wel een probleem, als er een afbeelding in de div staat, moet hij ook mee krimpen. Ik heb al gevonden dat als je de height op bijv. 95% zet, de width automatisch wordt berekend adhv de verhouding. Dit werkt ook wel, maar hoe geef ik aan dat de afbeelding zoveel % van de div mag gebruiken en niet van het hele scherm?

Huidige code:

	.headdiv
	{
		background-color: #BAC3CE;
		position: absolute;
		left: 10%;
		right: 10%;
		top: 2%;
		text-align: center;
		z-index: 1;
	}

	.logo
	{
		position: relative;
		height: 90%;
		z-index: 2;
	}

[dragonrider]

ik heb een variable die begint bij 0 maar dit moet eigenlijk 000 zijn. En als je de variable dan met 1 opteld dan moet het 001 worden

maar als je 'var teller = 000' doet gebruikt ie het gewoon als 0.

weet iemand hoe ik dit moet doen.

LB06 schreef op 16-12-2003 @ 18:11:
Ja, maar dat komt op mij over als een slechte workaround. Als ik het venster verklein, wordt de div ook kleiner, en dat heb ik liever niet.

dan kun je de div niet centreren. simple as that.

position: absolute; // of fixed
width: 50%;
left: 25%;
right: 25%;

dragonrider schreef op 16-12-2003 @ 19:42:
ik heb een variable die begint bij 0 maar dit moet eigenlijk 000 zijn. En als je de variable dan met 1 opteld dan moet het 001 worden

maar als je 'var teller = 000' doet gebruikt ie het gewoon als 0.

weet iemand hoe ik dit moet doen.

je moet daar een karakterreeks van maken. Nu pakt javascipt (?) dat op als een geheel getal, een integer.
je moet dus zelf een functie schrijven die, bijvoorbeeld, een bepaalde karakterreeks aanvuld met een meegegeven karakter tot de gewenste lengte.

In de programmeertaal FoxPro heet zo'n functie PADL, van pad left. 'Pad' is 'aanvullen', 'left' is 'links', dus links aanvullen (d'r is ook een PADR, van pad right).

Werking:

padl( 'aaaa', 8, 'b' ) => 'bbbbaaaa'
padl( 'aaaa', 9, 'b' ) => 'bbbbbaaaa'
padr( 'aaaa', 8, 'b' ) => 'aaaabbbb'
padr( 'aaaa', 9, 'b' ) => 'aaaabbbbb'

Wat jij zoekt:

stringgetal = padl( getal.toString(), 3, '0' );

of iets in die geest. veel plezier

[TIGEK]

ik ben php script gemaakt en alles werkt
Maar nu zit ik met het probleem. Ik moet een Kwadraat teken maken. En volgens mijn html editor is dat & sup 2;
Alleen als ik op mijn website kijkt (http://www.mol-clan.nl) upcoming wars --> zie je WK& sup 2; ipv van een kwadraat tekentje. Wat doe ik hier aan fout.

(EDIT FORUMSOFTWARE DEED FOUTE DINGEN)

[dragonrider]

ik heb in een inline frame allemaal thumbnails onder elkaar staan. Als je dan op zo'n thumbnail klikt wordt met javascript (parent.document.images.foto=naam) de foto geladen in de pagina.

Nu is het probleem dat als je bij het inline frame naar benede gescrold heb en je klikt op een thumnail dan springt hij weer omhoog en moet je weer opnieuw helemaal naar beneden scrollen. En dat is niet zo handig.

Weet iemand hoe je er voor kan zorgen dat het inline frame na klikken op de thumbnail niet meer naar boven springt.

[Droyd]

Zijn er editors die ervoor zorgen dat je geen fouten maakt ivm hoofdletters bv bij javascript, terwijl ze ook ondersteuning hebben voor gewone html, css en dergelijke?

(en ook nog eens freeware)

Ik weet dat DOT NET intellisense heeft voor jscript en vbscript, komt wel van pas, maar kvind het nog niet zo lekker werken.

En hoe testen jullie bepaalde code?
Gewoon de pagina door je browser laten inlezen is een mogelijkheid maar wanneer je script te complex wordt moet je steeds je hele ding doorlopen wat ik bij momenten heel vervelend vind
(m.a.w. gewoon bepaalde subs, of gedeelten van je code testen)

dragonrider schreef op 21-12-2003 @ 15:31:
ik heb in een inline frame allemaal thumbnails onder elkaar staan. Als je dan op zo'n thumbnail klikt wordt met javascript (parent.document.images.foto=naam) de foto geladen in de pagina.

Nu is het probleem dat als je bij het inline frame naar benede gescrold heb en je klikt op een thumnail dan springt hij weer omhoog en moet je weer opnieuw helemaal naar beneden scrollen. En dat is niet zo handig.

Weet iemand hoe je er voor kan zorgen dat het inline frame na klikken op de thumbnail niet meer naar boven springt.

Gebruikt javascript hiervoor,
history.back
Of iets in die richting..
Dan blijft je browser op dat punt, of je moet met anchors gaan werken, kan ook

Droyd schreef op 23-12-2003 @ 21:09:
Zijn er editors die ervoor zorgen dat je geen fouten maakt ivm hoofdletters bv bij javascript, terwijl ze ook ondersteuning hebben voor gewone html, css en dergelijke?

(en ook nog eens freeware)

Ik weet dat DOT NET intellisense heeft voor jscript en vbscript, komt wel van pas, maar kvind het nog niet zo lekker werken.

En hoe testen jullie bepaalde code?
Gewoon de pagina door je browser laten inlezen is een mogelijkheid maar wanneer je script te complex wordt moet je steeds je hele ding doorlopen wat ik bij momenten heel vervelend vind
(m.a.w. gewoon bepaalde subs, of gedeelten van je code testen)

Je wil een spellingschecker?
Euh, nee nooit gezien voor zoiets..
Tenzij jij je website in MS Word wil maken...

En testen gewoon door de browser,
en als je eenmaal genoeg ervaring hebt vind je een fout binnen no-time.