Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

Zeile mit JS einfügen

Frage Entwicklung JavaScript

Mitglied: lord-icon

lord-icon (Level 1) - Jetzt verbinden

21.12.2014, aktualisiert 16:38 Uhr, 1438 Aufrufe, 3 Kommentare

Ich bau an ein JS Script, was mir eine Zeile einfügt (klappt mitunter auch).

Siehe hier:
http://jsfiddle.net/28spv9jj/1/

3 Probleme habe ich hier aber noch:

=> + Button fügt eine Zeile am Ende hinzu. Ziel => in die nachfolgende Zeile einfügen, wo man drauf gedrückt hat
=> - Button soll gezielt die Zeile löschen, wo man drauf gedrückt hat
=> + Button müsste eine fortlaufenden Key erzeugen. (seiten[i][aktiv])

Letzteres ist aktuell mein größtes Problem.
1: Ein Submit überschreibt natürlich jede Zeile... ist ja alles seiten[0][aktiv]
2: Dann könnte ich vvlt. auch einen eindeutigen Namen haben den ich ansprechen kann... für's löschen.


Kann einer Helfen ?

P.s. Gern auch gegen $$$ (Nach Absprache)
Mitglied: colinardo
LÖSUNG 21.12.2014, aktualisiert um 17:37 Uhr
Hallo lord-icon,
hier eine Lösung für dein Beispiel:
01.
<!doctype html> 
02.
<html> 
03.
<head> 
04.
<meta charset="utf-8"> 
05.
<title>Demo</title> 
06.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
07.
<script type="text/javascript"> 
08.
$(document).ready(function(e) { 
09.
    //Aktion für alle Add-Buttons 
10.
	$('#dataTable .btnAdd').click(function(){ 
11.
		//referenz zur aktuellen Zeile holen 
12.
		var current_row = $(this).parent().parent(); 
13.
		// node duplizieren inklusive event-handler 
14.
		var new_row = $(current_row).clone(true); 
15.
		// Input für das neue Element leeren 
16.
		$(new_row).find("input.itm_input").val(''); 
17.
		// neue Zeile hinter die aktuelle hängen 
18.
		$(new_row).insertAfter(current_row); 
19.
		//Nummerierung erneuern 
20.
		reNumberNodes(); 
21.
	}); 
22.
	//Aktion für alle Delete-Buttons 
23.
	$('#dataTable .btnDelete').click(function(){ 
24.
		// wenn die Anzahl der Zeilen > 1 erlaube zu löschen 
25.
		if ($('#dataTable tr').length > 1){ 
26.
			$(this).parent().parent().remove(); 
27.
			reNumberNodes(); 
28.
		}else{ 
29.
			alert('Das letzte Element kann nicht gelöscht werden'); 
30.
31.
	}); 
32.
}); 
33.
 
34.
function reNumberNodes(){ 
35.
	$("#dataTable .itm_checkbox").each(function(index, element) { 
36.
        $(element).attr('name','seiten['+ index + '][aktiv]'); 
37.
    }); 
38.
	$("#dataTable .itm_input").each(function(index, element) { 
39.
        $(element).attr('name','seiten['+ index + '][value]'); 
40.
    }); 
41.
42.
</script> 
43.
</head> 
44.
<body> 
45.
 
46.
<form method="POST">             
47.
             
48.
<table id="dataTable" width="100%"  border="0"> 
49.
    <tr> 
50.
        <td><input class="itm_checkbox" value="" type="checkbox" name="seiten[0][aktiv]"/ checked="checked"></td> 
51.
        <td><input class="itm_input" type="text" style="width: 500px" name="seiten[0][value]"/></td> 
52.
        <td> 
53.
          <img class="btnAdd" src="http://findicons.com/files/icons/1156/fugue/16/plus_button.png"> 
54.
          <img class="btnDelete" src="http://findicons.com/files/icons/1156/fugue/16/minus_button.png"> 
55.
        </td> 
56.
        <td> 
57.
 
58.
        </td> 
59.
    </tr> 
60.
</table> 
61.
 
62.
<input type="submit" name="Submit" value="Daten jetzt Speichern" /> 
63.
</form>     
64.
</body> 
65.
</html>
Grüße Uwe
Bitte warten ..
Mitglied: lord-icon
21.12.2014, aktualisiert um 16:58 Uhr
Hallo Uwe,

Frameworks darf ich leider nicht verwenden. Sry das ich das nicht erwähnte.
Dachte mit meinen Code wäre das ersichtlich (das keine eingesetzt werden).

Nach Stunden lesen und Probieren hab ich das eine oder andere Problem auch schon behoben.
Sprich: Sauber wegspeichern kann ich es mitunter.

Nur das zeilengenaue einfügen gelingt mir nicht.

Aktueller Stand: http://jsfiddle.net/3h2shhL9/2/


Weiß einer Rat, welcher der einfachste Weg wäre... und wie ich den evtl. hinbekomme ?
Bitte warten ..
Mitglied: colinardo
21.12.2014, aktualisiert um 19:01 Uhr
Zitat von lord-icon:
Frameworks darf ich leider nicht verwenden. Sry das ich das nicht erwähnte.
auch kein Problem:
http://jsfiddle.net/3h2shhL9/4/

Schönen restlichen 4 Advent
Grüße Uwe
Bitte warten ..
Ähnliche Inhalte
VB for Applications
gelöst VbScript: ADODB.Stream: Neue Zeile einfügen (2)

Frage von BirdyB zum Thema VB for Applications ...

Batch & Shell
Batch bestimme Zeile einer vorherigen batch einfügen (9)

Frage von Frensche zum Thema Batch & Shell ...

Datenbanken
Mit sql eine Zeile einfügen, select und feste Werte (9)

Frage von helmuthelmut2000 zum Thema Datenbanken ...

Neue Wissensbeiträge
RedHat, CentOS, Fedora

Fedora, RedHat, Centos: DNS-Search Domain setzen

(13)

Tipp von Frank zum Thema RedHat, CentOS, Fedora ...

Drucker und Scanner

Samsung SL-M4025ND, firmware update und (kompatible) Tonerkassetten

(1)

Erfahrungsbericht von markus-1969 zum Thema Drucker und Scanner ...

Heiß diskutierte Inhalte
CMS
Lokales Wordpress im LAN - wie aufsetzen? (16)

Frage von Static zum Thema CMS ...

LAN, WAN, Wireless
gelöst Komplett neues Netzwerk, Ubiquiti WLAN, Router, Switch (16)

Frage von Freak-On-Silicon zum Thema LAN, WAN, Wireless ...

LAN, WAN, Wireless
IP im privaten Netz nicht erreichbar (14)

Frage von guntis zum Thema LAN, WAN, Wireless ...

LAN, WAN, Wireless
Devolo DLAN 500 pro Wireless+ (13)

Frage von IceAge zum Thema LAN, WAN, Wireless ...