Gömma HTML-kod

yakuzaemme · 2012-10-31, 01:42

Hallå!

Har gjort registeringsdelen som en popup, dvs att användaren klickar på "Registrera" och formuläret visas i en popup. Kräver att användaren ska fylla i födelsedatum, vilket betyder att jag har en väldigt lång dropdown med massa årsdatum.

Jag vill inte att denna ska synas vilken undersida man än är på, när man väl har registreringsformuläret framme kvittar det. Helt enkelt ska källkoden för den sidan man är på inte visa kod som inte presenteras för användaren.

Någon som har en aning hur man skall gå tillväga?

yakuzaemme · 2012-10-31, 01:54

#Update

Möjligtvis köra lite jQuery + AJAX, så att när användaren klickar på Registrera läser den av en seperat fil med all html-kod och sedan appendar detta in till en div.

Facebook har ju något liknande med deras notifikationsystem, dvs. att den vägrar visa det i källkoden utan kör ajax och presenterar datan därifrån.

ConnyWesth · 2012-10-31, 03:21

I AjaxControlToolkit finns ju en färdig KalenderKomponent, varför gå inte den att använda?

yakuzaemme · 2012-10-31, 04:10

Citat:

Ursprungligen postat av ConnyWesth

I AjaxControlToolkit finns ju en färdig KalenderKomponent, varför gå inte den att använda?

Usch och blä för färdiga komponenter, hellre skriver jag dem själv och skräddarsyr dem. Hur som helst så vill jag ej använda något sådant då det kommer vara fler popups på andra platser i sidan, och säkerligen fler dropdowns med olika värden.

Har ej hunnit kika in i mitt första förslag, sitter för fullt och pillar med databasstruktur, men kan det vara något som kan fungera?

Mvh

P3N · 2012-10-31, 08:15

Du kan ju som du själv säger köra en ajax request och hämta informationen via en fil. Jag hade använt php för att skapa filen med html koden, satt filtypen till js i php koden och loopat fram informationen och sen kört appendChild. Behövs inte jQuery för det men om du redan har det så...

Ett annat alternativ är ju att bara skapa det med en javascript funktion/fil och ladda scriptet med:

Kod:

function loadScript(url){
	var head = document.head || document.getElementsByTagName('head')[0];
	var script = document.createElement('script');
	script.type = 'text/javascript';
	script.src = url;
	head.appendChild(script);
}

yakuzaemme · 2012-10-31, 21:23

Citat:

Ursprungligen postat av P3N

Du kan ju som du själv säger köra en ajax request och hämta informationen via en fil. Jag hade använt php för att skapa filen med html koden, satt filtypen till js i php koden och loopat fram informationen och sen kört appendChild. Behövs inte jQuery för det men om du redan har det så...

Ett annat alternativ är ju att bara skapa det med en javascript funktion/fil och ladda scriptet med:

Kod:

function loadScript(url){
	var head = document.head || document.getElementsByTagName('head')[0];
	var script = document.createElement('script');
	script.type = 'text/javascript';
	script.src = url;
	head.appendChild(script);
}

Tack för svar!

Kommer förmodligen köra den jag nu skriver ihop till mycket av sajten, likt Facebook och deras system när det kommer till detta.

1) När användaren triggar clicked körs ett ajax-request, hämtar data.
2) Appendar den returnerade datan till elementet
3) Party

Något jag missat? Nu när jag tänker på det är stora delar av sajten uppbyggt på liknande sätt men aldrig tänkt på att källkoden ej visas sålänge man inte inspekterar elementen.

Kan detta påverka SEO måtro? Säg att jag har en webshop, där användaren scrollar nedåt och då laddas fler produkter genom ajax (direkt från databasen) och appendar. Kör man view-source visas ju endast de 'X' första produkterna.

Linuus · 2012-10-31, 21:32

Citat:

Ursprungligen postat av yakuzaemme

Tack för svar!

Kommer förmodligen köra den jag nu skriver ihop till mycket av sajten, likt Facebook och deras system när det kommer till detta.

1) När användaren triggar clicked körs ett ajax-request, hämtar data.
2) Appendar den returnerade datan till elementet
3) Party

Något jag missat? Nu när jag tänker på det är stora delar av sajten uppbyggt på liknande sätt men aldrig tänkt på att källkoden ej visas sålänge man inte inspekterar elementen.

Kan detta påverka SEO måtro? Säg att jag har en webshop, där användaren scrollar nedåt och då laddas fler produkter genom ajax (direkt från databasen) och appendar. Kör man view-source visas ju endast de 'X' första produkterna.

Eftersom produkterna läses in via JS kan det ju bli svårare att få sidan ordentligt indexerad (det kanske alla bots klarar bra idag?). Lägg in en vanlig "pagination" ifall besökaren inte har JS.

yakuzaemme · 2012-10-31, 21:50

Citat:

Ursprungligen postat av Linuus

Eftersom produkterna läses in via JS kan det ju bli svårare att få sidan ordentligt indexerad (det kanske alla bots klarar bra idag?). Lägg in en vanlig "pagination" ifall besökaren inte har JS.

Läst lite om det nu och kommit fram till följande:

Data som läses in av JS kan de flesta crawlers indexera.
Data som läses in via AJAX har de svårt med. Men....

Det går att hjälpa bots (Google) på traven lite. Du måste först berätta att du använder ajax just för den url:en. Därefter måste du returnera en HTML-snapshot av just den sidan och tillslut hålla tummarna.

Det hela verkar rätt komplicerat men nog värt det i slutändan.

Förresten Linuus, om det vore en enkel contentsida eller dylikt, så visst, ha en fallback för de som ej har JS aktiverat - men ska du ha en site med mycket integration m.m så är det den uppoffringen du får göra. Se bara på Facebook, Google m.fl

Linuus · 2012-10-31, 21:57

Citat:

Ursprungligen postat av yakuzaemme

Förresten Linuus, om det vore en enkel contentsida eller dylikt, så visst, ha en fallback för de som ej har JS aktiverat - men ska du ha en site med mycket integration m.m så är det den uppoffringen du får göra. Se bara på Facebook, Google m.fl

Visst, men ditt exempel med en webbshop lät ganska simpelt

När det gäller en shop kanske man vill vara lite extra noga med att inte stänga ute potentiella kunder som inte har JS aktiverat också (är väl kanske försumbara siffror idag dock).

yakuzaemme · 2012-10-31, 22:03

Citat:

Ursprungligen postat av Linuus

Visst, men ditt exempel med en webbshop lät ganska simpelt

När det gäller en shop kanske man vill vara lite extra noga med att inte stänga ute potentiella kunder som inte har JS aktiverat också (är väl kanske försumbara siffror idag dock).

Nu blir det långt här, samt lite OT, haha

Inte en shop det handlar om men såg det som enklaste exemplet, det rör sig alltså om objekt (se det som produkter) som läses in via ajax för en mer "2.0" upplevelse. Alla dessa är lika viktiga för sökmotorer att hitta.

Men såhär gör jag, ifall någon annan har liknande situation:

1) Triggar ett ajax-request call när användaren klickar på exempelvis "Registrera"
2) Appendar returdatan till en div som ligger i popup
3) Gör en klass som ska producera HTML-snapshots, som ges till crawlerbots så de indexerar sånt som visas "behind the scene"
4) Får massvis med besökare och är jätteglad.

Om någon har något bättre sätt förslag, dela gärna med dig - annars tror jag att jag är nöjd som det är!