Projekt-Anfragen: Tel: 07022/9319004 info@CodeDocu.de Software Entwicklung in C# WPF Asp.Net Core Vba Excel Word SQL-Server EF Linq, UWP Net
#

 

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

Mobile
»
Upload mit Progress Bar
»
jQuery: Wert einer HTML Progress Anzeige einstellen
»
Dateien hochladen und anzeigen mit jQuery ajax, FileUpload, Anzeigen des json Results
»
jQuery: 1-Button File-Upload mit Autostart
»
Dateien mit Ajax hochladen : Asp Net Core MVC und jQuery
»
jQuery: Function vor Submit Senden ausführen
»
jQuery: function nach dem Laden einer Seite ausführen
»
jQuery: HTML Elemente in ein Element einfügen
»
jQuery: Paste Event beim Einfügen von Text in ein HTML Element
»
jQuery: Insert event bei Text Eingabe

.

Jobs, Projekte, Angebote für Freiberufler, Selbstständig an Info@CodeDocu.de