feat: clicktoedit
This commit is contained in:
joerdav
parent
b003653967
commit
6472790346
|
|
@ -68,23 +68,6 @@ templ tbody(users []user, modified map[int]bool) {
|
||||||
templ Index(users []user) {
|
templ Index(users []user) {
|
||||||
@shared.Layout("Bulk Update") {
|
@shared.Layout("Bulk Update") {
|
||||||
<h2 class="title">Bulk Update</h2>
|
<h2 class="title">Bulk Update</h2>
|
||||||
<p>This demo shows how to implement a common pattern where rows are selected and then bulk updated. This is accomplished by putting a form around a table, with checkboxes in the table, and then including the checked values in <code>PUT</code>’s to two different endpoints: <code>activate</code>and <code>deactivate</code>:</p>
|
|
||||||
<pre><code class="language-html">
|
|
||||||
@shared.Raw() {
|
|
||||||
@demo(users)
|
|
||||||
}
|
|
||||||
</code></pre>
|
|
||||||
<p>The server will either activate or deactivate the checked users and then rerender the <code>tbody</code>tag with updated rows. It will apply the class <code>activate</code>or <code>deactivate</code>to rows that have been mutated. This allows us to use a bit of CSS to flash a color helping the user see what happened:</p>
|
|
||||||
<pre><code class="language-css">{ `.htmx-settling tr.deactivate td {
|
|
||||||
background: lightcoral;
|
|
||||||
}
|
|
||||||
.htmx-settling tr.activate td {
|
|
||||||
background: darkseagreen;
|
|
||||||
}
|
|
||||||
tr td {
|
|
||||||
transition: all 1.2s;
|
|
||||||
}` }</code></pre>
|
|
||||||
<h2 class="title">Demo</h2>
|
|
||||||
@demo(users)
|
@demo(users)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -536,300 +536,6 @@ func Index(users []user) templ.Component {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return err
|
return err
|
||||||
}
|
}
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_17 := `This demo shows how to implement a common pattern where rows are selected and then bulk updated. This is accomplished by putting a form around a table, with checkboxes in the table, and then including the checked values in `
|
|
||||||
_, err = templBuffer.WriteString(var_17)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_18 := `PUT`
|
|
||||||
_, err = templBuffer.WriteString(var_18)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_19 := `’s to two different endpoints: `
|
|
||||||
_, err = templBuffer.WriteString(var_19)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_20 := `activate`
|
|
||||||
_, err = templBuffer.WriteString(var_20)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_21 := `and `
|
|
||||||
_, err = templBuffer.WriteString(var_21)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_22 := `deactivate`
|
|
||||||
_, err = templBuffer.WriteString(var_22)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_23 := `:`
|
|
||||||
_, err = templBuffer.WriteString(var_23)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"language-html\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
var_24 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
|
||||||
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
|
||||||
if !templIsBuffer {
|
|
||||||
templBuffer = templ.GetBuffer()
|
|
||||||
defer templ.ReleaseBuffer(templBuffer)
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
err = demo(users).Render(ctx, templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
if !templIsBuffer {
|
|
||||||
_, err = io.Copy(w, templBuffer)
|
|
||||||
}
|
|
||||||
return err
|
|
||||||
})
|
|
||||||
err = shared.Raw().Render(templ.WithChildren(ctx, var_24), templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_25 := `The server will either activate or deactivate the checked users and then rerender the `
|
|
||||||
_, err = templBuffer.WriteString(var_25)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_26 := `tbody`
|
|
||||||
_, err = templBuffer.WriteString(var_26)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_27 := `tag with updated rows. It will apply the class `
|
|
||||||
_, err = templBuffer.WriteString(var_27)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_28 := `activate`
|
|
||||||
_, err = templBuffer.WriteString(var_28)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_29 := `or `
|
|
||||||
_, err = templBuffer.WriteString(var_29)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_30 := `deactivate`
|
|
||||||
_, err = templBuffer.WriteString(var_30)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_31 := `to rows that have been mutated. This allows us to use a bit of CSS to flash a color helping the user see what happened:`
|
|
||||||
_, err = templBuffer.WriteString(var_31)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"language-css\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// StringExpression
|
|
||||||
var var_32 string = `.htmx-settling tr.deactivate td {
|
|
||||||
background: lightcoral;
|
|
||||||
}
|
|
||||||
.htmx-settling tr.activate td {
|
|
||||||
background: darkseagreen;
|
|
||||||
}
|
|
||||||
tr td {
|
|
||||||
transition: all 1.2s;
|
|
||||||
}`
|
|
||||||
_, err = templBuffer.WriteString(templ.EscapeString(var_32))
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<h2")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"title\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_33 := `Demo`
|
|
||||||
_, err = templBuffer.WriteString(var_33)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</h2>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
// TemplElement
|
||||||
err = demo(users).Render(ctx, templBuffer)
|
err = demo(users).Render(ctx, templBuffer)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
|
|
@ -32,28 +32,6 @@ templ Form(u user) {
|
||||||
templ Index(u user) {
|
templ Index(u user) {
|
||||||
@shared.Layout("Click to Edit") {
|
@shared.Layout("Click to Edit") {
|
||||||
<h2 class="title">Click to Edit</h2>
|
<h2 class="title">Click to Edit</h2>
|
||||||
<p>The click to edit pattern provides a way to offer inline editing of all or part of a record without a page refresh.</p>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
This pattern starts with a UI that shows the details of a contact. The div has a button that will get the editing UI for the contact from
|
|
||||||
<code>/contacts/1/edit</code>
|
|
||||||
<pre><code class="language-html">
|
|
||||||
@shared.Raw() {
|
|
||||||
@Display(u)
|
|
||||||
}
|
|
||||||
</code></pre>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
This returns a form that can be used to edit the contact
|
|
||||||
<pre><code class="language-html">
|
|
||||||
@shared.Raw() {
|
|
||||||
@Form(u)
|
|
||||||
}
|
|
||||||
</code></pre>
|
|
||||||
</li>
|
|
||||||
<li>The form issues a <code>PUT</code>back to <code>/contacts/1</code>, following the usual REST-ful pattern.</li>
|
|
||||||
</ul>
|
|
||||||
<h2 class="title">Demo</h2>
|
|
||||||
@Display(u)
|
@Display(u)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -658,277 +658,6 @@ func Index(u user) templ.Component {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return err
|
return err
|
||||||
}
|
}
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_21 := `The click to edit pattern provides a way to offer inline editing of all or part of a record without a page refresh.`
|
|
||||||
_, err = templBuffer.WriteString(var_21)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<ul>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_22 := `This pattern starts with a UI that shows the details of a contact. The div has a button that will get the editing UI for the contact from `
|
|
||||||
_, err = templBuffer.WriteString(var_22)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_23 := `/contacts/1/edit`
|
|
||||||
_, err = templBuffer.WriteString(var_23)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"language-html\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
var_24 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
|
||||||
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
|
||||||
if !templIsBuffer {
|
|
||||||
templBuffer = templ.GetBuffer()
|
|
||||||
defer templ.ReleaseBuffer(templBuffer)
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
err = Display(u).Render(ctx, templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
if !templIsBuffer {
|
|
||||||
_, err = io.Copy(w, templBuffer)
|
|
||||||
}
|
|
||||||
return err
|
|
||||||
})
|
|
||||||
err = shared.Raw().Render(templ.WithChildren(ctx, var_24), templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_25 := `This returns a form that can be used to edit the contact`
|
|
||||||
_, err = templBuffer.WriteString(var_25)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"language-html\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
var_26 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
|
||||||
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
|
||||||
if !templIsBuffer {
|
|
||||||
templBuffer = templ.GetBuffer()
|
|
||||||
defer templ.ReleaseBuffer(templBuffer)
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
err = Form(u).Render(ctx, templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
if !templIsBuffer {
|
|
||||||
_, err = io.Copy(w, templBuffer)
|
|
||||||
}
|
|
||||||
return err
|
|
||||||
})
|
|
||||||
err = shared.Raw().Render(templ.WithChildren(ctx, var_26), templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_27 := `The form issues a `
|
|
||||||
_, err = templBuffer.WriteString(var_27)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_28 := `PUT`
|
|
||||||
_, err = templBuffer.WriteString(var_28)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_29 := `back to `
|
|
||||||
_, err = templBuffer.WriteString(var_29)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_30 := `/contacts/1`
|
|
||||||
_, err = templBuffer.WriteString(var_30)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_31 := `, following the usual REST-ful pattern.`
|
|
||||||
_, err = templBuffer.WriteString(var_31)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</li>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</ul>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<h2")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"title\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_32 := `Demo`
|
|
||||||
_, err = templBuffer.WriteString(var_32)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</h2>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
// TemplElement
|
||||||
err = Display(u).Render(ctx, templBuffer)
|
err = Display(u).Render(ctx, templBuffer)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
|
|
@ -38,14 +38,6 @@ templ replaceMe(page int) {
|
||||||
templ Index(users []user) {
|
templ Index(users []user) {
|
||||||
@shared.Layout("Click to Load") {
|
@shared.Layout("Click to Load") {
|
||||||
<h2 class="title">Click to Load</h2>
|
<h2 class="title">Click to Load</h2>
|
||||||
<p>This example shows how to implement click-to-load the next page in a table of data. The crux of the demo is the final row:</p>
|
|
||||||
<pre><code class="language-html">
|
|
||||||
@shared.Raw() {
|
|
||||||
@replaceMe(1)
|
|
||||||
}
|
|
||||||
</code></pre>
|
|
||||||
<p>This row contains a button that will replace the entire row with the next page of results (which will contain a button to load the next page of results). And so on.</p>
|
|
||||||
<h2 class="title">Demo</h2>
|
|
||||||
@demo(users, 1)
|
@demo(users, 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -366,128 +366,6 @@ func Index(users []user) templ.Component {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return err
|
return err
|
||||||
}
|
}
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_14 := `This example shows how to implement click-to-load the next page in a table of data. The crux of the demo is the final row:`
|
|
||||||
_, err = templBuffer.WriteString(var_14)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<code")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"language-html\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
var_15 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
|
||||||
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
|
||||||
if !templIsBuffer {
|
|
||||||
templBuffer = templ.GetBuffer()
|
|
||||||
defer templ.ReleaseBuffer(templBuffer)
|
|
||||||
}
|
|
||||||
// TemplElement
|
|
||||||
err = replaceMe(1).Render(ctx, templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
if !templIsBuffer {
|
|
||||||
_, err = io.Copy(w, templBuffer)
|
|
||||||
}
|
|
||||||
return err
|
|
||||||
})
|
|
||||||
err = shared.Raw().Render(templ.WithChildren(ctx, var_15), templBuffer)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</code>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</pre>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_16 := `This row contains a button that will replace the entire row with the next page of results (which will contain a button to load the next page of results). And so on.`
|
|
||||||
_, err = templBuffer.WriteString(var_16)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</p>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<h2")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"title\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_17 := `Demo`
|
|
||||||
_, err = templBuffer.WriteString(var_17)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</h2>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
// TemplElement
|
||||||
err = demo(users, 1).Render(ctx, templBuffer)
|
err = demo(users, 1).Render(ctx, templBuffer)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
|
|
@ -47,7 +47,6 @@ templ demo() {
|
||||||
templ Index() {
|
templ Index() {
|
||||||
@shared.Layout("Delete Row") {
|
@shared.Layout("Delete Row") {
|
||||||
<h2 class="title">Delete Row</h2>
|
<h2 class="title">Delete Row</h2>
|
||||||
<h2 class="title">Demo</h2>
|
|
||||||
@demo()
|
@demo()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -581,35 +581,6 @@ func Index() templ.Component {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
return err
|
return err
|
||||||
}
|
}
|
||||||
// Element (standard)
|
|
||||||
_, err = templBuffer.WriteString("<h2")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Element Attributes
|
|
||||||
_, err = templBuffer.WriteString(" class=\"title\"")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString(">")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Text
|
|
||||||
var_25 := `Demo`
|
|
||||||
_, err = templBuffer.WriteString(var_25)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
_, err = templBuffer.WriteString("</h2>")
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// Whitespace (normalised)
|
|
||||||
_, err = templBuffer.WriteString(` `)
|
|
||||||
if err != nil {
|
|
||||||
return err
|
|
||||||
}
|
|
||||||
// TemplElement
|
// TemplElement
|
||||||
err = demo().Render(ctx, templBuffer)
|
err = demo().Render(ctx, templBuffer)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,62 @@
|
||||||
|
package editrow
|
||||||
|
|
||||||
|
import (
|
||||||
|
"net/http"
|
||||||
|
"strconv"
|
||||||
|
"strings"
|
||||||
|
)
|
||||||
|
|
||||||
|
type user struct {
|
||||||
|
name, email string
|
||||||
|
}
|
||||||
|
|
||||||
|
var users = []user{
|
||||||
|
{"Joe Smith", "joe@smith.org"},
|
||||||
|
{"Angie MacDowell", "angie@macdowell.org"},
|
||||||
|
{"Fuqua Tarkenton", "fuqua@tarkenton.org"},
|
||||||
|
{"Kim Yee", "kim@yee.org"},
|
||||||
|
}
|
||||||
|
|
||||||
|
func Handlers(prefix string, mux *http.ServeMux) {
|
||||||
|
mux.HandleFunc(prefix+"/", index)
|
||||||
|
mux.HandleFunc(prefix+"/edit/", editUser)
|
||||||
|
mux.HandleFunc(prefix+"/contact/", contacts)
|
||||||
|
}
|
||||||
|
|
||||||
|
func index(w http.ResponseWriter, r *http.Request) {
|
||||||
|
// Load users
|
||||||
|
Index(users).Render(r.Context(), w)
|
||||||
|
}
|
||||||
|
|
||||||
|
func editUser(w http.ResponseWriter, r *http.Request) {
|
||||||
|
segments := strings.Split(r.URL.Path, "/")
|
||||||
|
userID, _ := strconv.Atoi(segments[len(segments)-1])
|
||||||
|
form(userID, users[userID]).Render(r.Context(), w)
|
||||||
|
}
|
||||||
|
|
||||||
|
func contacts(w http.ResponseWriter, r *http.Request) {
|
||||||
|
if r.Method == http.MethodGet {
|
||||||
|
getRow(w, r)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if r.Method == http.MethodPut {
|
||||||
|
putUser(w, r)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
w.WriteHeader(404)
|
||||||
|
}
|
||||||
|
|
||||||
|
func getRow(w http.ResponseWriter, r *http.Request) {
|
||||||
|
segments := strings.Split(r.URL.Path, "/")
|
||||||
|
userID, _ := strconv.Atoi(segments[len(segments)-1])
|
||||||
|
row(userID, users[userID]).Render(r.Context(), w)
|
||||||
|
}
|
||||||
|
|
||||||
|
func putUser(w http.ResponseWriter, r *http.Request) {
|
||||||
|
segments := strings.Split(r.URL.Path, "/")
|
||||||
|
userID, _ := strconv.Atoi(segments[len(segments)-1])
|
||||||
|
r.ParseForm()
|
||||||
|
name, email := r.FormValue("name"), r.FormValue("email")
|
||||||
|
users[userID] = user{name, email}
|
||||||
|
row(userID, users[userID]).Render(r.Context(), w)
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,45 @@
|
||||||
|
package editrow
|
||||||
|
|
||||||
|
import (
|
||||||
|
"fmt"
|
||||||
|
|
||||||
|
"examples/shared"
|
||||||
|
)
|
||||||
|
|
||||||
|
templ demo(users []user) {
|
||||||
|
<table class="table"><thead>
|
||||||
|
<tr>
|
||||||
|
<th>Name</th>
|
||||||
|
<th>Email</th>
|
||||||
|
<th></th>
|
||||||
|
</tr>
|
||||||
|
</thead><tbody hx-target="closest tr" hx-swap="outerHTML">
|
||||||
|
for i, u := range users {
|
||||||
|
@row(i, u)
|
||||||
|
}
|
||||||
|
</tbody></table>
|
||||||
|
}
|
||||||
|
|
||||||
|
templ row(id int, u user) {
|
||||||
|
<tr>
|
||||||
|
<td>{ u.name }</td>
|
||||||
|
<td>{ u.email }</td>
|
||||||
|
<td><button class="button" hx-get={ fmt.Sprintf("/edit-row/edit/%d", id) }>Edit</button></td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
|
|
||||||
|
templ form(id int, u user) {
|
||||||
|
<tr hx-trigger="cancel" class="editing" hx-get={ fmt.Sprintf("/edit-row/contact/%d", id) }>
|
||||||
|
<td><input name="name" value={ u.name }/></td>
|
||||||
|
<td><input name="email" value={ u.email }/></td>
|
||||||
|
<td><button class="button" hx-get={ fmt.Sprintf("/edit-row/contact/%d", id) }>Cancel</button><button class="button is-black" hx-put={ fmt.Sprintf("/edit-row/contact/%d", id) } hx-include="closest tr">Save</button></td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
|
|
||||||
|
templ Index(users []user) {
|
||||||
|
@shared.Layout("Delete Row") {
|
||||||
|
<h2 class="title">Edit Row</h2>
|
||||||
|
@demo(users)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,550 @@
|
||||||
|
// Code generated by templ@(devel) DO NOT EDIT.
|
||||||
|
|
||||||
|
package editrow
|
||||||
|
|
||||||
|
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||||
|
|
||||||
|
import "github.com/a-h/templ"
|
||||||
|
import "context"
|
||||||
|
import "io"
|
||||||
|
import "bytes"
|
||||||
|
|
||||||
|
// GoExpression
|
||||||
|
import (
|
||||||
|
"fmt"
|
||||||
|
|
||||||
|
"examples/shared"
|
||||||
|
)
|
||||||
|
|
||||||
|
func demo(users []user) templ.Component {
|
||||||
|
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
||||||
|
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
||||||
|
if !templIsBuffer {
|
||||||
|
templBuffer = templ.GetBuffer()
|
||||||
|
defer templ.ReleaseBuffer(templBuffer)
|
||||||
|
}
|
||||||
|
ctx = templ.InitializeContext(ctx)
|
||||||
|
var_1 := templ.GetChildren(ctx)
|
||||||
|
if var_1 == nil {
|
||||||
|
var_1 = templ.NopComponent
|
||||||
|
}
|
||||||
|
ctx = templ.ClearChildren(ctx)
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<table")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" class=\"table\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<thead>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<tr>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_2 := `Name`
|
||||||
|
_, err = templBuffer.WriteString(var_2)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_3 := `Email`
|
||||||
|
_, err = templBuffer.WriteString(var_3)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</th>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</tr>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</thead>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<tbody")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" hx-target=\"closest tr\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-swap=\"outerHTML\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// For
|
||||||
|
for i, u := range users {
|
||||||
|
// TemplElement
|
||||||
|
err = row(i, u).Render(ctx, templBuffer)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</tbody>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</table>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if !templIsBuffer {
|
||||||
|
_, err = io.Copy(w, templBuffer)
|
||||||
|
}
|
||||||
|
return err
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
func row(id int, u user) templ.Component {
|
||||||
|
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
||||||
|
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
||||||
|
if !templIsBuffer {
|
||||||
|
templBuffer = templ.GetBuffer()
|
||||||
|
defer templ.ReleaseBuffer(templBuffer)
|
||||||
|
}
|
||||||
|
ctx = templ.InitializeContext(ctx)
|
||||||
|
var_4 := templ.GetChildren(ctx)
|
||||||
|
if var_4 == nil {
|
||||||
|
var_4 = templ.NopComponent
|
||||||
|
}
|
||||||
|
ctx = templ.ClearChildren(ctx)
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<tr>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// StringExpression
|
||||||
|
var var_5 string = u.name
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(var_5))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// StringExpression
|
||||||
|
var var_6 string = u.email
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(var_6))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<button")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" class=\"button\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-get=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(fmt.Sprintf("/edit-row/edit/%d", id)))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_7 := `Edit`
|
||||||
|
_, err = templBuffer.WriteString(var_7)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</button>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</tr>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if !templIsBuffer {
|
||||||
|
_, err = io.Copy(w, templBuffer)
|
||||||
|
}
|
||||||
|
return err
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
func form(id int, u user) templ.Component {
|
||||||
|
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
||||||
|
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
||||||
|
if !templIsBuffer {
|
||||||
|
templBuffer = templ.GetBuffer()
|
||||||
|
defer templ.ReleaseBuffer(templBuffer)
|
||||||
|
}
|
||||||
|
ctx = templ.InitializeContext(ctx)
|
||||||
|
var_8 := templ.GetChildren(ctx)
|
||||||
|
if var_8 == nil {
|
||||||
|
var_8 = templ.NopComponent
|
||||||
|
}
|
||||||
|
ctx = templ.ClearChildren(ctx)
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<tr")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" hx-trigger=\"cancel\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" class=\"editing\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-get=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(fmt.Sprintf("/edit-row/contact/%d", id)))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (void)
|
||||||
|
_, err = templBuffer.WriteString("<input")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" name=\"name\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" value=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(u.name))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (void)
|
||||||
|
_, err = templBuffer.WriteString("<input")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" name=\"email\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" value=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(u.email))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<button")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" class=\"button\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-get=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(fmt.Sprintf("/edit-row/contact/%d", id)))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_9 := `Cancel`
|
||||||
|
_, err = templBuffer.WriteString(var_9)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</button>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<button")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" class=\"button is-black\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-put=")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(templ.EscapeString(fmt.Sprintf("/edit-row/contact/%d", id)))
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(" hx-include=\"closest tr\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_10 := `Save`
|
||||||
|
_, err = templBuffer.WriteString(var_10)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</button>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</td>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</tr>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if !templIsBuffer {
|
||||||
|
_, err = io.Copy(w, templBuffer)
|
||||||
|
}
|
||||||
|
return err
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
func Index(users []user) templ.Component {
|
||||||
|
return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
||||||
|
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
||||||
|
if !templIsBuffer {
|
||||||
|
templBuffer = templ.GetBuffer()
|
||||||
|
defer templ.ReleaseBuffer(templBuffer)
|
||||||
|
}
|
||||||
|
ctx = templ.InitializeContext(ctx)
|
||||||
|
var_11 := templ.GetChildren(ctx)
|
||||||
|
if var_11 == nil {
|
||||||
|
var_11 = templ.NopComponent
|
||||||
|
}
|
||||||
|
ctx = templ.ClearChildren(ctx)
|
||||||
|
// TemplElement
|
||||||
|
var_12 := templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
|
||||||
|
templBuffer, templIsBuffer := w.(*bytes.Buffer)
|
||||||
|
if !templIsBuffer {
|
||||||
|
templBuffer = templ.GetBuffer()
|
||||||
|
defer templ.ReleaseBuffer(templBuffer)
|
||||||
|
}
|
||||||
|
// Element (standard)
|
||||||
|
_, err = templBuffer.WriteString("<h2")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Element Attributes
|
||||||
|
_, err = templBuffer.WriteString(" class=\"title\"")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString(">")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Text
|
||||||
|
var_13 := `Edit Row`
|
||||||
|
_, err = templBuffer.WriteString(var_13)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = templBuffer.WriteString("</h2>")
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// Whitespace (normalised)
|
||||||
|
_, err = templBuffer.WriteString(` `)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
// TemplElement
|
||||||
|
err = demo(users).Render(ctx, templBuffer)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if !templIsBuffer {
|
||||||
|
_, err = io.Copy(w, templBuffer)
|
||||||
|
}
|
||||||
|
return err
|
||||||
|
})
|
||||||
|
err = shared.Layout("Delete Row").Render(templ.WithChildren(ctx, var_12), templBuffer)
|
||||||
|
if err != nil {
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
if !templIsBuffer {
|
||||||
|
_, err = io.Copy(w, templBuffer)
|
||||||
|
}
|
||||||
|
return err
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
7
main.go
7
main.go
|
|
@ -5,6 +5,7 @@ import (
|
||||||
"examples/clicktoedit"
|
"examples/clicktoedit"
|
||||||
"examples/clicktoload"
|
"examples/clicktoload"
|
||||||
"examples/deleterow"
|
"examples/deleterow"
|
||||||
|
"examples/editrow"
|
||||||
"log"
|
"log"
|
||||||
"net/http"
|
"net/http"
|
||||||
|
|
||||||
|
|
@ -58,4 +59,10 @@ var examples = []Example{
|
||||||
Slug: "delete-row",
|
Slug: "delete-row",
|
||||||
Handlers: deleterow.Handlers,
|
Handlers: deleterow.Handlers,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
Name: "Edit Row",
|
||||||
|
Desc: "Demonstrates how to edit rows in a table",
|
||||||
|
Slug: "edit-row",
|
||||||
|
Handlers: editrow.Handlers,
|
||||||
|
},
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue