Som besökare på Hamsterpaj samtycker du till användandet av s.k. cookies för att förbättra din upplevelse hos oss. Jag förstår, ta bort denna ruta!
Annons

Jquery flera "artikel" sidor

Skapad av ThLoser, 2014-02-26 23:13 i Webbutveckling & Programmering

2 050
4 inlägg
0 poäng
ThLoser
Visningsbild
P 37 Vetlanda Hjälte 72 inlägg
0
Har gjort ett skript som lägger till fler sidor (passar perfekt till artiklar och sånt.)

Är mycket medveten om att koden ser för jävligt ut, skulle fixa iordning den bara jag fick en fungerande kod först, men det gick inte riktigt som jag hade tänkt mig...

Just nu sparar jag ner alla "sidnamn" till en hidden input så dom lägger sig såhär Sida 1, Sida 2, Sida 3.

Den delen funkar som den ska, det är när jag ska radera "menyn/sidan" som det börjar, jag lyckas få min räknare att gå ner ett steg men jag vet inte hur jag ska få ut sidnamnet ifrån input rutan, någon som har en liten aning?

Iaf här kommer den slarviga koden, har ni tips på vad jag kan förändra eller en lösning får ni jätte gärna dela med er.

Ett stycke javascript-kod:

$(".addLinks").click(function() {
var total = parseFloat($(".hiddenCounter").val()) + 1;
$(".hiddenCounter").val(total);
$("#articles_textarea").update_textarea(total);
});
$(document).on('click', '.cogwheel', function() {
var link = $(this).data('pageid');
$(".pages").not(".page" + link).hide();
$(".links").not("#link-" + link).show();
$("#link-" + link).toggle();
$(".page" + link).toggle();
});
$(document).on('click', '.deletecross', function() {
$(".deleteClass" + $(this).data('pageid')).remove();
var total = parseFloat($(".hiddenCounter").val()) - 1;
$(".hiddenCounter").val(total);
var this_val = $(".pagae" + $(this).data('pageid')).val();
this_val.replace($(".pagae" + $(this).data('pageid')).val(), "");
$(".pagae" + total).val(this_val);
});
$(document).on('keyup', '.pages', function() {
var pageID = $(this).data('pageid');
var pages = $(".pagae").val();
$(".pagae" + pageID).val($(this).val());
$(".pagetest" + pageID).html($(this).val());
$(".pagae").val(pages + $(this).val());
$("#link-" + pageID).html($(this).val());
});

message = new Array();
jQuery.fn.update_textarea = function(test) {
//for (i=0;i<test;++i) {
if (message[test]) { $(".MenuLinks").append('<tr><td width="150"><a href="#" id="link-' + test + '">Sida ' + test + '</a></td><td align="right"><span class="glyphicon glyphicon-cog"></span></td></tr>');$("#articles_textarea").append('<h2>askda</h2><textarea id="editor-1"></textarea>'); }
else {
message[test] = '';
var TDRow1 = '<tr class="deleteClass' + test + '"><td width="150"><a href="#Sida' + test + '" id="link-' + test + '" data-toggle="tab" class="links">Sida ' + test + '</a><input type="text" name="pages[]" value="Sida ' + test + '" class="pages page' + test + '" data-pageid="' + test + '"></td>';
var TDRow2 = '<td align="right" width="20"><span class="glyphicon glyphicon-cog cogwheel" data-pageid="' + test + '" title="Redigera"></span></td></tr>';
var TDRowRemove = '<td align="right" width="10"><span class="glyphicon glyphicon-remove deletecross" data-pageid="' + test + '" #ff0000;" title="Radera"></span></td>';
var TDFake = '<td></td>';
if (test != 1) {
var TRRow = TDRow1 + TDRowRemove + TDRow2;
}
else {
var TRRow = TDRow1 + TDFake + TDRow2;
}
$(".MenuLinks").append(TRRow); $("#articles_textarea").append('<div id="Sida' + test + '" class="tab-pane"><input type="hidden" class="pagae' + test + '" name="pagae[]" value="Sida ' + test + '"> <h2 class="pagetest' + test + '">Sida ' + test + '</h2><textarea name="editor[]" id="editor-' + test + '" class="editor" data-pageid="' + test + '"></textarea></div>');
$("#editor-" + test).wysibb({lang: "en"});
}
//}
}

/* If no textareas available add a new one */
if (message.length == 0) {
$(this).update_textarea(1);
$("#Sida1").addClass("active");
}


Bara så att det inte blir något missförstått, denna koden ligger inom document ready. och .Addlinks är en knapp du trycker på, och wysibb är en rysk texteditor, använder den bara som test just nu, så får man igång det med en vanlig textarea blir jag lycklig.

Volbeat - Evelyn is the thing ! :D

Är reklamen ivägen? Logga in eller registrera dig så försvinner den!

Tvillingen
Visningsbild
P 31 Hjälte 3 117 inlägg
0
Det där blev lite krångligt när man inte ser all HTML-kod, så att det hade fungerat att testa koden själv.

Här kan du testa ett litet exempel jag slängde ihop.
http://jsfiddle.net/b4AH6/

Pastebin
http://pastebin.com/KP96Nd3c (JS)
http://pastebin.com/JT6VQFtz (HTML)
http://pastebin.com/TgfAqJU9 (CSS)

Sedan är det bara att lägga till en knapp för att spara det och använda dig av jQuery.post för att skicka datan till servern. All data läggs automatiskt till i varje objekt i listan editors.

Jag är ond!

ThLoser
Visningsbild
P 37 Vetlanda Hjälte 72 inlägg
Trådskapare
0

Svar till Tvillingen [Gå till post]:
http://pastebin.com/gsmpyXmu - Där är hela sidan!


På din fiddle, så försöker man radera så kommer det ju bara fram en ny ruta alltså ett nytt tal är det meningen?

Volbeat - Evelyn is the thing ! :D

Tvillingen
Visningsbild
P 31 Hjälte 3 117 inlägg
0

Svar till ThLoser [Gå till post]:
Ja det var tanken, så att man kan börja om från början utan att anstränga sig. Annars finns det inte så många anledningar att trycka på ta bort när man bara har en sida uppe för redigering. Bara att ta bort det beteendet om du inte vill ha det :)

Jag är ond!


Forum » Datorer & IT » Webbutveckling & Programmering » Jquery flera "artikel" sidor

Ansvariga ordningsvakter:

Användare som läser i den här tråden just nu

1 utloggad

Skriv ett nytt inlägg

Hej! Innan du skriver om ett potentiellt problem så vill vi påminna dig om att du faktiskt inte är ensam. Du är inte onormal och världen kommer inte att gå under, vi lovar! Så slappna av och gilla livet i några minuter - känns det fortfarande hemskt? Skriv gärna ner dina tankar och frågor, vi älskar att hjälpa just dig!

Den här tråden är äldre än Rojks drömtjej!

Det senaste inlägget i den här tråden skrevs för över tre månader sedan. Är du säker på att du vill återuppliva diskussionen? Har du något vettigt att tillföra eller passar din fråga i en ny tråd? Onödiga återupplivningar kommer att låsas så tänk efter en extra gång!

Hjälp

Det här är en hjälpruta

Här får du korta tips och förklaringar om forumet. Välj kapitel i rullningslisten här ovanför.

Rutan uppdateras automagiskt

När du använder funktioner i forumet så visas bra tips här.


Annons
Annons
Annons
Annons