wie kann man mit jQuery eine Function ausführen lassen,
bevor ein Formular gesendet wird.
Lösung:
|
$("#frmEdit").submit(functionxxx);
|
Beispiel:
In diesem Beispiel wird vor dem Senden eines Formulars in
einer Webseite noch ein Aktualisierungsscript ausgeführt.
Hierzu ist in jQuery auf das Formular der event .Submit(..)
definiert.
Im Beispiel wird das Div-Eingabe-Feld übertragen in ein HTML
Form Textarea Feld, welchese an den Asp Server gesendet werden kann.
Code jQuery, Asp Core Razor
jQuery script in der Datei : demo_jQuery_01.cshtml
Razor Webseite, mit jQuery.
Das jQuery script ist am Ende der Webseite im script Block
|
@{
Layout = null;
}
<div>
<form asp-action="demo_jQuery_01_post" id="frmEdit">
<div class="form-group">
<input type="submit" value="Send" class="btn btn-default" />
</div>
<br />
<div class="form-group">
Editor HTML (div, no form)
<br />
<div contenteditable="true" id="ctlEditor_HTML" name="ctlEditor_HTML" style="height:100px;width:90%;overflow:auto;border:1px solid red;">
</div>
<br />
<br />
Editor Text (textarea,
form-control)
<br />
<textarea class="form-control" id="ctlEditor_Text" name="ctlEditor_Text" style="height:100px;width:90%; overflow:auto;border:1px solid blue;color:gray;">
@ViewData["Text1"]
</textarea>
</div>
</form>
</div>
@*------------<
jQuery-script >------------*@
<script type="text/javascript" src="~/lib/jquery/dist/jquery.js"></script>
<script>
//----<
events >----
$(document).ready(load_HTML_to_Div);
$("#frmEdit").submit(transfer_Text);
//----</
events >----
//----<
functions >----
function load_HTML_to_Div() {
var sHTML = $("#ctlEditor_Text").val();
$("#ctlEditor_HTML").empty();
$("#ctlEditor_HTML").append(sHTML);
}
function transfer_Text() {
var sText = $("#ctlEditor_HTML").html();
$("#ctlEditor_Text").val(sText);
}
//----</
functions >----
</script>
@*------------</
jQuery-script >------------*@
|
Asp Core MVC Controller
Das Laden und Postback der Demoseite ist unter dem Asp MVC Controller
DemosController.cs
Asp core mvc Code, C#
Methoden
HttpGet: demo_jQuery_01
Httppost: demo_jQuery_01_post
|
using System;
using Microsoft.AspNetCore.Mvc;
using IWois_Core.Data;
using Microsoft.AspNetCore.Http;
using System.Web;
namespace IWois_Core.Controllers
{
public class DemosController : Controller
{
private readonly ApplicationDbContext _dbContext;
public
DemosController(ApplicationDbContext context)
{
_dbContext = context;
}
public IActionResult demo_jQuery_01()
{
///-------------< Index_All >-------------
ViewData["Text1"] = "jQuery Demo load submit";
ViewData["Text2"] = "This is Text2 bbbb";
return View("demo_jQuery_01");
///-------------</ Index_All
>-------------
}
[HttpPost]
public IActionResult
demo_jQuery_01_post(IFormCollection formFields)
{
//-------------< demo_jQuery_01_post
>-------------
//< get form input >
string sHTML = formFields["ctlEditor_Text"];
//</ get form input >
//< convert to Text >
string sText = HTML.HTML_to_Text(sHTML);
//</ convert to Text >
//< load Data >
ViewData["Text1"] = "postback-return:
<br/>"
+ sHTML;
//ViewData["Text2"] = sText;
//</ load Data >
//< out >
return View("demo_jQuery_01");
//</
out >
//-------------</
demo_jQuery_01_post >-------------
}
}
}
|
Submit Send jQuery