gitea/templates/devtest/fetch-action.tmpl
wxiaoguang 0f4b0cf892
Refactor some frontend problems (#32646)
1. correct the modal usage on "admin email list" page (then
`web_src/js/features/admin/emails.ts` is removed)
2. use `addDelegatedEventListener` instead of `jQuery().on`
3. more jQuery related changes and remove jQuery from
`web_src/js/features/common-button.ts`
4. improve `confirmModal` to make it support header, and remove
incorrect double-escaping
5. fix more typescript related types
6. fine tune devtest pages and add more tests
2024-11-26 15:36:55 +00:00

46 lines
1.8 KiB
Handlebars

{{template "devtest/devtest-header"}}
<div class="page-content devtest ui container">
{{template "base/alert" .}}
<div>
<h1>link-action</h1>
<div>
Use "window.fetch" to send a request to backend, the request is defined in an "A" or "BUTTON" element.
It might be renamed to "link-fetch-action" to match the "form-fetch-action".
</div>
<div>
<button class="link-action" data-url="fetch-action-test?k=1">test action</button>
<button class="link-action" data-url="fetch-action-test?k=1" data-modal-confirm="confirm?">test with confirm</button>
<button class="ui red button link-action" data-url="fetch-action-test?k=1" data-modal-confirm="confirm?">test with risky confirm</button>
<button class="ui button link-action" data-url="fetch-action-test?k=1" data-modal-confirm-header="confirm header" data-modal-confirm-content="confirm content">test with confirm header</button>
</div>
</div>
<div>
<h1>form-fetch-action</h1>
<div>Use "window.fetch" to send a form request to backend</div>
<div>
<form method="get" action="fetch-action-test?k=1" class="form-fetch-action">
<button name="btn">submit get</button>
</form>
<form method="post" action="fetch-action-test?k=1" class="form-fetch-action">
<div><textarea name="text" rows="3"></textarea></div>
<div><label><input name="check" type="checkbox"> check</label></div>
<div><button name="btn">submit post</button></div>
</form>
<form method="post" action="no-such-uri" class="form-fetch-action">
<div class="tw-py-8">bad action url</div>
<div><button name="btn">submit test</button></div>
</form>
</div>
</div>
</div>
<style>
.ui.message.flash-message {
text-align: left;
}
.form-fetch-action {
margin-bottom: 1em;
border: 1px red dashed; /* show the border for demo purpose */
}
</style>
{{template "devtest/devtest-footer"}}