1
votes

Asp.Net-Core lit les valeurs du modèle js en cliquant sur

J'ai ce code dans mon application Asp.Net-Web avec Razor Pages et j'essaie de lire les entrées dans js uniquement lorsque vous cliquez sur le bouton Soumettre.

Dans ma page Razor

<script>
  var val1 = @Model.Value1;
  var val2 = @Model.Value2;
</script>

Et dans mes js, je les lis:

<form method="post">
 <input asp-for="Value1" id="value1" />
 <input asp-for="Value2" id="value2" />
 <button type="submit" value="Search" id="clickme">Search</button>
</form>

Mais le problème est qu'avec ce code, les valeurs sont lues au démarrage de l'application, et J'ai besoin qu'ils soient lus seulement après avoir cliqué sur le bouton d'envoi. Est-ce que je peux faire cela d'une manière ou d'une autre?

c# asp.net-core

0 commentaires

3 Réponses :

0
votes

Utilisez le code javascript au lieu de la syntaxe de rasoir . Pour obtenir la valeur de @ Model.Value1 , utilisez document.getElementById comme ci-dessous.

<script>
  var val1 = 10;
  var val2 = abc; //<-- here it will not have "", so it will treated abc as an object.
  // Also it will throw an error here because there might not be any object abc.
  // If you want it to be print as string then you should be wrap @Model.Value2 with "" or '' like below.
  // var val2 = "@Model.Value2"; which will convert to var val2 = "abc";
</script>

Votre bouton clickme n'a pas d'attribut onclick , donc je suppose que vous pouvez lier un événement de clic à partir de javascript ou de jquery code en utilisant document.getElementById ("clickme"). onclick = function () {...}; ou $ ('# clickme'). click (function () {...}); code>. Dans cette fonction, vous devriez utiliser var val1 = document.getElementById ('Value1'). Value pour obtenir la dernière valeur.

Remarque lorsque vous utilisez la syntaxe de rasoir comme var val1 = @ Model.Value1; alors ce sera analysé et envoyé à votre navigateur avec le html ou le texte correspondant. Donc, si vous essayez d'inspecter le html à partir de la console du navigateur et d'afficher la source du rendu, votre bloc script sera comme ci-dessous. (Supposons que votre @ Model.Value1 = 10 & @ Model.Value2 = "abc") .

var val1 = document.getElementById('Value1').value;
var val2 = document.getElementById('Value2').value;

0 commentaires

0
votes

D'après ce que j'ai compris, vous avez besoin de les valeurs à lire uniquement après le clic Soumettre . Vous devez ajouter un événement de clic au bouton Soumettre:

<script>
var val1 ; 
var val2 ;
function initializeValues()
{
 val1 = @Model.Value1;
 val2 = @Model.Value2;
}
</script>

La fonction initializeValues () ne sera exécutée que lorsque vous cliquerez sur le bouton Soumettre:

 <button type="submit" value="Search" id="clickme" onclick="initializeValues()">Search</button>

0 commentaires

1
votes

Si vous utilisez @ Model.PropertyName , il restituera toujours la valeur au démarrage de l'application, la bonne façon est d'utiliser js pour obtenir la valeur.

Voici une démo fonctionnelle comme ci-dessous :

public void OnPost(string Value1,string Value2) 
{ 
    //do your stuff
}

Je ne sais pas quel est votre scénario, si vous voulez juste passer la valeur des deux entrées au backend, même pas besoin d'utiliser js. Gardez simplement le nom de la propriété et le le nom d'entrée doit être le même. Et dans les pages de rasoir, il a l'attribut BindProperty pour lier les données:

Index.cshtml:

public class IndexModel : PageModel
{
    [BindProperty]
    public string Value1 { get; set; }
    [BindProperty]
    public string Value2 { get; set; }       

    public async Task<IActionResult> OnGet()
    {                   
        return Page();
    }
    public void OnPost() 
    { 
        //do your stuff
    }
}

0 commentaires