I am very new to ASP.Net Core and web-app development, this is my first project. I am trying to use a dropdown button that posts back onlick what button is pressed. Whatever is pressed is the action user want to do and I will update the displayed messages and labels in the webapp. Particularly I want to display a message with the action user chose using TempData, when the submit button is clicked. But the the message only shows up every other time. Meaning it only shows up the 2nd, 4th, 6th.. time I press the submit button. Here is the C# part of the code:
public class AdminModel : PageModel
{
[TempData]
public string Action { get; set; } = "";
[TempData]
public string DisplayMessage { get; set; } = "";
public string DropDownMessage = "Actions";
public string ChangeValueLabel = "Set Point to";
public string CurrentPoint = "No User Selected";
public void OnGet()
{
}
public IActionResult OnPost()
{
// Call ProcessSwipe here with student id from card reader
return Page();
}
public IActionResult OnPostSubmit()
{
// Call ProcessSwipe here with student id from card reader
DisplayMessage = $"Action done with {Action}";
return Page();
}
public IActionResult OnPostCheckBalance()
{
DropDownMessage = "Check Point Balances";
ChangeValueLabel = "No Input Needed";
CurrentPoint = "99";
Action = "CheckBalance";
return Page();
}
public IActionResult OnPostIncreasePoint()
{
DropDownMessage = "Increase/Award Points";
ChangeValueLabel = "Increase Point By";
Action = "IncreasePoint";
return Page();
}
public IActionResult OnPostDecreasePoint()
{
DropDownMessage = "Decrease/Redeem Points";
ChangeValueLabel = "Decrease Point by";
Action = "DecreasePoint";
return Page();
}
public IActionResult OnPostSetPoint()
{
DropDownMessage = "Set Point Balances";
ChangeValueLabel = "Set Point to";
Action = "SetPoint";
return Page();
}
public IActionResult OnPostDeleteAccount()
{
DropDownMessage = "Delete Account";
ChangeValueLabel = "No Input Needed";
Action = "DeleteAccount";
return Page();
}
}
The HTML/Bootstrap part
<!-- Content section -->
<!-- $('#datebox').val($(this).html());-->
<div class="container-fluid">
<h1>Welcome to Learning Factory Admin Page</h1>
@{
if (TempData.Peek("DisplayMessage") != null)
{
<h3>Message: @TempData.Peek("DisplayMessage")</h3>
}
}
<div class="form-row text-left">
<div class="col">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownActionMenu"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span id="selected">@Model.DropDownMessage</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownActionMenu" role="menu">
<li>
<form asp-page-handler="CheckBalance" method="post">
<button class="btn btn-secondary" style="width:200px;" id="1" value="Check Point Balances">Check Point Balances</button>
</form>
</li>
<li>
<form asp-page-handler="IncreasePoint" method="post">
<button class="btn btn-secondary" style="width:200px;" id="2" value="Increase/Award Points">Increase/Award Points</button>
</form>
</li>
<li>
<form asp-page-handler="DecreasePoint" method="post">
<button class="btn btn-secondary" style="width:200px;" id="3" value="Decrease/Redeem Points">Decrease/Redeem Points</button>
</form>
</li>
<li>
<form asp-page-handler="SetPoint" method="post">
<button class="btn btn-secondary" style="width:200px;" id="4" value="Set Point Balance">Set Point Balance</button>
</form>
</li>
<li>
<form asp-page-handler="DeleteAccount" method="post">
<button class="btn btn-secondary" style="width:200px;" id="5" value="Delete Account">Delete Account</button>
</form>
</li>
</ul>
</div>
<form asp-page-handler="Submit" method="post">
<div class="row">
<label for="UIDSelect">Choose User Account to work on:</label>
<input id="UIDSelect" name="UIDSelect" type="text" placeholder="934191061" />
<label for="">Current Point total: @Model.CurrentPoint</label>
</div>
<div class="row">
<label for="ChangeValue">@Model.ChangeValueLabel:</label>
<input id="ChangeValue" name="ChangeValue" type="text" placeholder="Enter Value" />
</div>
<div class="row">
<button class="btn btn-primary" ID ="6" type="submit">Submit</button>
<button class="btn btn-primary" type="reset">Reset</button>
</div>
</form>
</div>
</div>
</div>
In the part of the code where I set DisplayMessage = $"Action done with {Action}";
, the {Action}
part of the message only appears every other click of the submit button, starting the second click. No message is shown on the first click.
The Action done with
part of the message appears every time, except the first click.
Any help is appreciated.