<div class="container">
<div class="row" style="padding-top: 240px;">
<a href="#" class="btn btn-large btn-primary" rel="popover"
data-content="<form><input type="text"/></form>"
data-placement="top" data-original-title="Fill in form">Open form</a>
</div>
</div>
Ich vermute, dass ich den Formularinhalt in einer Javascript-Funktion speichern würde ...
Wie kann ich ein Formular in einem Bootstrap-Popover enthalten?
javascript
jquery
twitter-bootstrap
twitter-bootstrap-3
popover
user1438003
quelle
quelle
Ich würde mein Formular in das Markup und nicht in ein Daten-Tag einfügen. So könnte es funktionieren:
JS-Code:
HTML-Markup:
Demo
Alternative Ansätze:
X-Editable
Vielleicht möchten Sie einen Blick auf X-Editable werfen . Eine Bibliothek, mit der Sie auf der Grundlage von Popovers bearbeitbare Elemente auf Ihrer Seite erstellen können.
Webkomponenten
Mike Costello hat Bootstrap Web Components veröffentlicht . Diese raffinierte Bibliothek verfügt über eine Popover-Komponente, mit der Sie das Formular als Markup einbetten können:
Demo
quelle
data-title="Some Title"
das<a id="myID">
Tagtrigger
Option. (trigger: 'focus'
)quelle
Gefällt mir diese Arbeitsdemo http://jsfiddle.net/7e2XU/21/show/# * Update: http://jsfiddle.net/kz5kjmbt/
JavaScript-Code:
Bildschirmfoto
quelle
:)
Sie können das Formular aus einem ausgeblendeten
div
Element mit der von Bootstrap bereitgestelltenhidden
Klasse laden .JavaScript:
quelle
$(...).parent().html()
durch$(...).clone()
;)Oder versuchen Sie es mit diesem
Der zweite enthält den zweiten versteckten Div-Inhalt, damit das Formular funktioniert und auf der Geige getestet werden kann. Http://jsfiddle.net/7e2XU/21/
quelle
Eine Komplettlösung für alle, die sie benötigen könnten. Ich habe sie bisher mit guten Ergebnissen verwendet
JS:
HTML:
CSS:
quelle
Ich arbeite viel in WordPress, also benutze PHP.
Meine Methode besteht darin, mein HTML in einer PHP-Variablen zu enthalten und die Variable dann wiederzugeben
data-content
.zusammen mit
quelle