I'm doing a automation project using selenium webdriver and c#.
Now I have a challenge to solve: my system is a system to pay tickets, and each ticket is dynamic in the page with its components, to pay it's need to click in a dynamic checkbox(each ticket has the checkbox). Below, has a example with some tickets to pay:
<form action="/PagamentoOnline/fix_3001837_conexaoCore/Pagamento/FormaPagamento" id="frmDebitos" method="post"><input data-val="true" data-val-required="The TipoPagamento field is required." id="TipoPagamento" name="TipoPagamento" type="hidden" value="0" /> <div class="row">
<div class="col-md-6 txt-gray txt-right"><input data-val="true" data-val-required="The TipoSolicitacaoPagamento field is required." id="TipoSolicitacaoPagamento" name="TipoSolicitacaoPagamento" type="hidden" value="Pagamento" /></div>
<div class="col-md-3 txt-gray txt-right">
<input id="DataPagamento" name="DataPagamento" type="hidden" value="2017-02-13">
<span class="huge">13/02/2017</span>
<br />
<span class="medium">Data de pagamento</span>
</div>
<div class="col-md-3 txt-gray txt-right">
<span class="huge total-debitos-selecionados"></span>
<br />
<span class="medium">Total de débitos</span>
</div>
</div>
<hr />
<div class="row">
<div class="col-md-4 col-debito">
<input class="chk-debitos-selecionados" id="DebitosSelecionados_0_" name="DebitosSelecionados[0]" type="checkbox" value="29133609" /><input name="DebitosSelecionados[0]" type="hidden" value="false" />
<div class="panel panel-gray"
data-codigo-titulo="29133609"
data-valor-pagar="21.41"
data-valor-original="20"
data-data-vencimento="Venc.: 15/12/2016"
data-numero-parcela="1"
data-descricao-tipo-debito="Parcela"
data-sigla-periodo-letivo="2016/2">
<div class="panel-heading">
<div class="row">
<div class="col-xs-12">
<div class="medium pull-right"><i class="glyphicon glyphicon-unchecked"></i></div>
<div class="huge pull-left" data-bind="text: valor">R$ 21,41</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="pull-left">Valor Atualizado</div>
<div class="pull-right">1ª Parcela - 2016/2</div>
</div>
</div>
</div>
<div class="panel-footer">
<span class="pull-left">Débito: R$ 20,00</span>
<span class="pull-right">Venc.: 15/12/2016</span>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="col-md-4 col-debito">
<input class="chk-debitos-selecionados" id="DebitosSelecionados_1_" name="DebitosSelecionados[1]" type="checkbox" value="29608740" /><input name="DebitosSelecionados[1]" type="hidden" value="false" />
<div class="panel panel-gray"
data-codigo-titulo="29608740"
data-valor-pagar="21.43"
data-valor-original="20.99"
data-data-vencimento="Venc.: 19/01/2017"
data-numero-parcela="1"
data-descricao-tipo-debito="Parcela"
data-sigla-periodo-letivo="2016/2">
<div class="panel-heading">
<div class="row">
<div class="col-xs-12">
<div class="medium pull-right"><i class="glyphicon glyphicon-unchecked"></i></div>
<div class="huge pull-left" data-bind="text: valor">R$ 21,43</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="pull-left">Valor Atualizado</div>
<div class="pull-right">1ª Parcela - 2016/2</div>
</div>
</div>
</div>
<div class="panel-footer">
<span class="pull-left">Débito: R$ 20,99</span>
<span class="pull-right">Venc.: 19/01/2017</span>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="col-md-4 col-debito">
<input class="chk-debitos-selecionados" id="DebitosSelecionados_2_" name="DebitosSelecionados[2]" type="checkbox" value="29675826" /><input name="DebitosSelecionados[2]" type="hidden" value="false" />
<div class="panel panel-gray"
data-codigo-titulo="29675826"
data-valor-pagar="1210.42"
data-valor-original="1180.95"
data-data-vencimento="Venc.: 07/02/2017"
data-numero-parcela="2"
data-descricao-tipo-debito="Parcela"
data-sigla-periodo-letivo="2017/1">
<div class="panel-heading">
<div class="row">
<div class="col-xs-12">
<div class="medium pull-right"><i class="glyphicon glyphicon-unchecked"></i></div>
<div class="huge pull-left" data-bind="text: valor">R$ 1.210,42</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="pull-left">Valor Atualizado</div>
<div class="pull-right">2ª Parcela - 2017/1</div>
</div>
</div>
</div>
<div class="panel-footer">
<span class="pull-left">Débito: R$ 1.180,95</span>
<span class="pull-right">Venc.: 07/02/2017</span>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
<hr />
<div class="row">
<div class="col-md-7"></div>
<div class="col-md-2 top-right">
</div>
<div class="col-md-1"></div>
<div class="col-md-2 top-right">
<button id="PagamentoCredito" type="submit" class="btn btn-success">Pagar com cartão de credito</button>
</div>
</div>
Each div class:
<div class="col-md-4 col-debito">
is a ticket to pay.
I need to select one of this tickets and select the checkbox
<i class="glyphicon glyphicon-unchecked"></i>
I tryed to use a foreach loop to select a especified checkbox of a ticket:
ticketToPay = "cod_ticket_to_pay";
ReadOnlyCollection<IWebElement> ticketsInSystem= driver.FindElements(By.XPath("//div[#class='panel panel-gray']"));
foreach (IWebElement ticketInformation in ticketsInSystem)
{
if (ticketInformation.GetAttribute("data-codigo-titulo").Equals(ticketToPay))
{
IWebElement checkBoxTicket = ticketInformation.FindElement(By.XPath("//*[#class='glyphicon glyphicon-unchecked']"));
checkBoxTicket .Click();
}
}
But when the action of the element checkboxTicket is click in the first element of his type, not in the correct ticket. Anyone know how to solve this?
One ticket - one checkbox
And
Selected ticket - selectecd checkbox to click.
I have no idea about how to do this with c#. But Using Java Language you can do this way.
WebElement check1 = driver.findElement(By.xpath("//input[#value='29133609']"));
WebElement check2 = driver.findElement(By.xpath("//input[#value='29608740']"));
WebElement check3 = driver.findElement(By.xpath("//input[#value='29675826']"));
int[] check_values = new int[] {29133609, 29608740, 29675826};
for(int i =0; i<check_values.length; i++)
{
WebElement check_source = driver.findElement(By.xpath("//input[#value='"+check_values[i]+"']"));
if(!check_source.isSelected())
{
check_source.click();
Thread.sleep(2500);
}
}
Related
I have two forms in my view: One of them is modal and could get excel file. after importing excel file and proccessing its data -> i need these data in the other form of my view. How Can I Handle this?
i want when i submit excel import form, its data show in the first form for sending sms.
Here is my view code
<form asp-controller="Festival" asp-action="SendNotificationToCustomer" method="post">
<div class="card-body">
#await Component.InvokeAsync("AdminWidget", new { widgetZone = AdminWidgetZones.FestivalDetailsTop, additionalData = Model })
<div class="card card-default">
<div class="card-body">
<div class="form-group row" id="OperatorName-area">
<div class="col-md-12">
<div class="input-group">
<div class="col-md-6">
<div class="input-group">
<nop-select asp-for="SelectedCustomerRoleIdsForSms" asp-items="Model.AvailableCustomerRolesForSms" asp-multiple="true" />
</div>
<label asp-for="SMSPhonenumbers" />
<textarea asp-for="SMSPhonenumbers" asp-required="true" />
<span asp-validation-for="SMSPhonenumbers"></span>
</div>
<div class="col-md-6">
#Html.HiddenFor(x=>x.Id)
<label asp-for="TextMessage" />
<textarea asp-for="TextMessage" asp-required="true" />
<span asp-validation-for="TextMessage"></span>
</div>
<div class="input-group-append py-2">
<button type="submit" id="btnSendNotification" class="btn btn-info rounded-sm">
#T("Admin.festival.notification.Button")
</button>
</div>
<div class="input-group-append py-2 mr-2">
<button type="button" name="importexcel" class="btn bg-olive rounded-sm" data-toggle="modal" data-target="#importexcel-window">
<i class="fas fa-upload"></i>
#T("Admin.Common.Import")
</button>
</div>
<span>#Model.PhonenumbersFromExcel</span>
</div>
<span asp-validation-for="TextMessage"></span>
</div>
</div>
</div>
</div>
</div>
</form>
<div id="importexcel-window" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="importexcel-window-title">
<div class="modal-dialog">
<form asp-controller="Festival" asp-action="ImportPhonenumbersFromExcel" method="post" enctype="multipart/form-data">
<div class="form-horizontal">
<div class="modal-body">
<div class="form-group row">
<div class="col-md-2">
<div class="label-wrapper">
</div>
</div>
<div class="col-md-10">
<input type="file" id="importexcelfile" name="importexcelfile" class="form-control" />
<input type="hidden" id="currentId" name="currentId" value="#Model.Id" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary"></button>
</div>
</div>
</form>
</div>
</div>
</div>
I am new to Razor pages and trying to create a page with a partial view. The partial view has a dropdownlist and a text input for Quantity field and a submit button. The Partial View renders correctly but when I click on the Submit button the Model passed to the Code behind has no value.
Here is the code I have
_PartialAddons.cshtml
#*
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*#
#{
}
#model Public.Areas.Register.AddonListDto
<form method="post">
#Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD $45</b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="#(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="#Model.Id">
</div>
</div>
<div style="padding:5px;">
<a class="btn green" asp-page-handler="AddToCart">Add to Cart</a>
</div>
</form>
This is the Main Page
#foreach (var addons in Model.StoreAddonList)
{
<div class="panel card panel-default" style="margin-top:10px;">
<div class="panel-heading card-header" role="tab">
<div class="panel-title">
<div class="accordion-toggle" role="button" aria-expanded="true">
<div accordion-heading="" style="width:100%;">
#addons.Title
<i class="pull-right float-xs-right glyphicon glyphicon-chevron-down"></i>
</div>
</div>
</div>
</div>
<div class="panel-collapse collapse in show" role="tabpanel" style="overflow: visible; height: auto; display: block;" aria-expanded="true" aria-hidden="false">
<div class="panel-body card-block card-body">
<div style="padding-top:10px;background-color:#ffffff;clear:both;">
<div style="width:100%">
<div style="float:left;width:20%;text-align:left;">
Name
</div>
<div style="float:left;width:30%;padding-left:10px;">
#addons.Description
</div>
</div>
<div style="float:left;width:40%;padding-left:10px;">
<div>
#{
await Html.RenderPartialAsync("_PartialAddons.cshtml", addons);
}
</div>
</div>
<div style="clear:both;">
</div>
</div>
</div>
</div>
</div>
}
This is the Index.cshtml.cs to handle the submit
public ActionResult OnGetAddToCart(AddonListDto addOnList)
{
var sass = Quantity;
var tass = SelectedSkus;
return null;
}
The AddonListDto is null on the OnGetAddToCart Method. Have been trying to get this working for the past two days. Any help would be greatly appriciated
If you want to submit your data, you need to use OnPost instead of OnGet in razor pages and set the handler name in the <form> tag. For example:
handler:
public ActionResult OnPostAddToCart(AddonListDto addOnList)
partial view:
#model Public.Areas.Register.AddonListDto
<form method="post" asp-page-handler="AddToCart">
#Html.HiddenFor(Model => Model.Quantity)
<div style="padding:5px;">
<b>NZD $45</b>
</div>
<div>
<div style="padding:5px;">
<select id="skuSelect" asp-for="SelectedSkus" asp-items="#(new SelectList(Model.AddonSkus,"SkuId","SkuName"))" class="form-control">
<option>Please select one</option>
</select>
</div>
<div style="padding:5px;">
<input type="hidden" name="handler" value="Quantity" />
<input asp-for="Quantity" name="Quantity" class="form-control ng-untouched ng-pristine ng-valid" max="999" min="0" style="width:150px;" type="number" value="0" id="#Model.Id">
</div>
</div>
<div style="padding:5px;">
<input type="submit" value="Add To Cart" class="btn btn-primary" />
</div>
</form>
I am working on a Blazor page for adding a new object. The object "RepairOrder" has List of object "RepairSection".
On the page there is an area that will loop through the List "RepairOrder"."RepairSections" and show the elements:
<div class="col-lg-10">
#if (sections.Count > 0)
{
foreach (var sec in sections)
{
<h3>Section #sec.SectionNumber</h3>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-5">
<label for="Failure" class="control-label">Failure: </label>
<input for="Failure" class="form-control" bind="#sec.Failure" readonly />
</div>
<div class="col-lg-1"></div>
<div class="col-lg-1">
<label><input type="checkbox" checked="#IsCApprovedChecked(sec)" /> Warranty</label>
</div>
<div class="col-lg-2">
<label><input type="checkbox" value="#IsWarrantyChecked(sec)" /> Repair Approved</label>
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="AdminComments" class="control-label">Admin Comments: </label>
<input for="AdminComments" class="form-control" bind="#sec.AdminComments" readonly />
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="TechComments" class="control-label">Tech Comments: </label>
<input for="TechComments" class="form-control" bind="#sec.TechComments" readonly />
</div>
</div>
}
}
</div>
After all the current sections in the list have been added to the page, there is a button to add a new section. When the button is clicked, the function changes a bool value to true to open a modal as a dialog. The modal contains fields to input a new section elements.
function called to open the modal:
protected void AddSectionCalled()
{
_newSection = new RepairSection();
this.isAddNew = true;
}
Modal Code:
<div class="modal" tabindex="-1" style="display:block" role="dialog">
<div class="modal-dialog modal-dialog-scrollable modal-xl">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">New Repair Section</h3>
<button type="button" class="close" onclick="#CloseModal"><span aria-hidden="true">X</span></button>
</div>
<div class="modal-body">
<form>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-2">
<label for="sectionLetter" class="control-label">Section: </label>
<input for="sectionLetter" class="form-control" bind="#_newSection.SectionNumber" />
</div>
<div class="col-lg-1"></div>
<div class="col-lg-2">
<label><input type="checkbox" bind="#_newSection.Warranty" /> Warranty</label>
</div>
<div class="col-lg-2">
<label><input type="checkbox" bind="#_newSection.CustomerApproved" /> Repair Approved</label>
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_failure" class="control-label">Failure: </label>
<input for="_failure" class="form-control" bind="#_newSection.Failure"/>
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_adminComments" class="control-label">Admin Comments: </label>
<input for="_adminComments" class="form-control" bind="#_newSection.AdminComments" />
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_techComments" class="control-label">Tech Comments: </label>
<input for="_techComments" class="form-control" bind="#_newSection.TechComments"/>
</div>
</div>
<br/>
<button class="btn btn-primary float-left" onclick="AddNewSection">Add New Section</button>
</form>
</div>
</div>
</div>
</div>
When the "Add New Section" button is clicked, the "_newSection" object created from the information collected in the modal is added to the "sections" list that was originally looped through when the page was loaded.
private void AddNewSection()
{
sections.Add(_newSection);
this.StateHasChanged();
this.isAddNew = false;
}
as you can see I added the "StateHasChanged()" after the new section is added to the sections list. However the page does not render to display the new section.
I originally had created dummy data on the page "OnInitAsync()" event that loaded the sections list with data before it was displayed. This way I could make sure the page displayed what was in the list correctly.
How can I make the page re-render the information in the list after user adds a new object to the list?
----Edit-----
Below is the code for the entire page. I will try and minimize this on the weekend, however there really is not a lot here.
#page "/AddRepairOrder"
#using ShopLiveWebVersion2._0.Models
#using ShopLiveWebVersion2._0.DataAccess
#using ShopLiveWebVersion2._0.Services
#using ShopLiveWebVersion2._0.Data
#inject IUriHelper UriHelper
#inject RepairOrderContext context
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10"><h1>Create New Repair Order</h1></div>
</div>
<br /><br />
<form id="AddROForm">
<div class="form-group">
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-2">
<label for="ControlNumber" class="control-label">Repair Order #: </label>
<input for="ControlNumber" class="form-control" bind="#ro.ControlNumber" maxlength="15" required />
</div>
<div class="col-lg-1">
<label for="TagNumber" class="control-label">Tag #: </label>
<input for="TagNumber" class="form-control" bind="#ro.TagNumber" maxlength="8" />
</div>
<div class="col-lg-3">
<label for="VIN" class="control-label">VIN: </label>
<input for="VIN" class="form-control" bind="#ro.VIN" maxlength="18" />
#*<small id="Chasis" class="form-text text-muted">#ro.GetChassisNumber()</small> figure out how to get chassis from vin after box looses focus*#
</div>
<div class="col-lg-2">
<label for="Make" class="control-label">Make: </label>
<input for="Make" class="form-control" bind="#ro.Make" maxlength="30" />
</div>
<div class="col-lg-2">
<label for="Madel" class="control-label">Model: </label>
<input for="Madel" class="form-control" bind="#ro.Madel" maxlength="30" />
</div>
</div>
<div class="row AddRow">
<div class="col-lg-1"></div>
<div class="col-lg-4">
<label for="Customer" class="control-label">Customer: </label>
<input for="Custoemr" class="form-control" bind="#ro.Customer" maxlength="50" />
</div>
<div class="col-lg-2">
<label asp-for="Location" class="control-label">Vehicle Location: </label>
<select asp-for="Location" class="form-control" bind="#ro.Location">
<option value="">-- Select a Location --</option>
#foreach (var loc in Location)
{
<option value="#loc">#loc</option>
}
</select>
</div>
<div class="col-lg-2">
<label asp-for="Assigned" class="control-label">Assigned: </label>
<select asp-for="Assigned" class="form-control" bind="#ro.Assigned">
<option value="">-- Select an Employee --</option>
#foreach (var emp in Employee)
{
<option value="#emp">#emp</option>
}
</select>
</div>
<div class="col-lg-2">
<label asp-for="Status" class="control-label">Status: </label>
<select asp-for="Status" class="form-control" bind="#ro.Status">
<option value="">-- Select a Status --</option>
#foreach (var st in Status)
{
<option value="#st">#st</option>
}
</select>
</div>
</div>
<br />
<div class="row"><div class="col-lg-1"></div><div class="col-lg-10"><hr id="Double" /></div></div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
#if (sections.Count > 0)
{
foreach (var sec in sections)
{
<h3>Section #sec.SectionNumber</h3>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-5">
<label for="Failure" class="control-label">Failure: </label>
<input for="Failure" class="form-control" bind="#sec.Failure" readonly />
</div>
<div class="col-lg-1"></div>
<div class="col-lg-1">
<label><input type="checkbox" checked="#IsCApprovedChecked(sec)" /> Warranty</label>
</div>
<div class="col-lg-2">
<label><input type="checkbox" value="#IsWarrantyChecked(sec)" /> Repair Approved</label>
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="AdminComments" class="control-label">Admin Comments: </label>
<input for="AdminComments" class="form-control" bind="#sec.AdminComments" readonly />
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="TechComments" class="control-label">Tech Comments: </label>
<input for="TechComments" class="form-control" bind="#sec.TechComments" readonly />
</div>
</div>
}
}
</div>
</div>
<div class="row"></div>
</div> #*Form-group*#
</form>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-9">
<br /><br />
<button class="btn btn-primary float-right" onclick="#AddSectionCalled">Add New Section</button>
</div>
</div>
#if (isAddNew == true)
{
<div class="modal" tabindex="-1" style="display:block" role="dialog">
<div class="modal-dialog modal-dialog-scrollable modal-xl">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">New Repair Section</h3>
<button type="button" class="close" onclick="#CloseModal"><span aria-hidden="true">X</span></button>
</div>
<div class="modal-body">
<form>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-2">
<label for="sectionLetter" class="control-label">Section: </label>
<input for="sectionLetter" class="form-control" bind="#_newSection.SectionNumber" />
</div>
<div class="col-lg-1"></div>
<div class="col-lg-2">
<label><input type="checkbox" bind="#_newSection.Warranty" /> Warranty</label>
</div>
<div class="col-lg-2">
<label><input type="checkbox" bind="#_newSection.CustomerApproved" /> Repair Approved</label>
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_failure" class="control-label">Failure: </label>
<input for="_failure" class="form-control" bind="#_newSection.Failure" />
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_adminComments" class="control-label">Admin Comments: </label>
<input for="_adminComments" class="form-control" bind="#_newSection.AdminComments" />
</div>
</div>
<div class="row">
<div class="col-lg-1"></div>
<div class="col-lg-10">
<label for="_techComments" class="control-label">Tech Comments: </label>
<input for="_techComments" class="form-control" bind="#_newSection.TechComments" />
</div>
</div>
<br />
<button class="btn btn-primary float-left" onclick="AddNewSection()">Add New Section</button>
</form>
</div>
</div>
</div>
</div>
}
#functions
{
private RepairOrder ro;
private RepairOrder incomingRO;
private RepairOrderDataAccess RoData;
private string chassis;
private List<string> Location;
private List<string> Employee;
private List<string> Status;
private FileService fileService;
private List<RepairSection> sections;
private bool isAddNew;
//for new repair section modal
private RepairSection _newSection;
protected override async Task OnInitAsync()
{
ro = new RepairOrder();
Location = new List<string>();
Employee = new List<string>();
Status = new List<string>();
sections = new List<RepairSection>();
isAddNew = false;
fileService = new FileService();
RoData = new RepairOrderDataAccess(context);
await LoadData();
}
private async Task LoadData()
{
Location = await Task.Run(() => fileService.ReadLocation());
Employee = await Task.Run(() => fileService.ReadEmployees());
Status = await Task.Run(() => fileService.ReadStatus());
}
public string IsCApprovedChecked(RepairSection sc)
{
if (sc.CustomerApproved == true)
{
return "checked";
}
else
{
return "";
}
}
public string IsWarrantyChecked(RepairSection sc)
{
if (sc.Warranty == true)
{
return "checked";
}
else
{
return "";
}
}
protected void AddSectionCalled()
{
_newSection = new RepairSection();
this.isAddNew = true;
}
private void AddNewSection()
{
sections.Add(_newSection);
this.StateHasChanged();
this.isAddNew = false;
}
private void CloseModal()
{
this.isAddNew = false;
}
There is a problem with the way you have bound the onclick event of the button on the modal form.
you have onclick="AddNewSection()"
- writing it this way will likely be interpreted as a pure javascript call and if you inspect the DOM in your browser tools, you will likely see onclick="AddNewSection()" on the button.
You should have onclick="#AddNewSection"
- this way, Blazor will hook up the onclick event to your C# method.
I have PromotionAdmin controller and view for get data from user.I'm trying to get data from multiple forms in view I have two form in view like this
<div class="col-md-9 well admin-content" id="spotpromotion">
<div class="row setup-content" id="step-1">
<div class="col-xs-8 col-md-offset-2">
<div class="col-md-12">
#using (Html.BeginForm("SpotPromotion", "PromotionAdmin", FormMethod.Post, new { #class = "form-group", enctype = "multipart/form-data", id = "SpotsubmitForm" }))
{
#Html.AntiForgeryToken()
<div class="form-group">
<label class="control-label" for="idspchgpointtxt">Charge Point ID<span style="color: red">*</span> :</label>
<input class="form-control" name="spchgpointid" placeholder="Charge Point" id="spchgpointid" required="required">
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idspmessagetxt">Message<span style="color: red">*</span> : </label>
<textarea class="form-control" id="spmessage" placeholder="Message" name="spmessage" rows="5" ></textarea>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idspstarttimetxt">Start Time<span style="color: red">*</span> :</label>
<div class="row">
<div class='col-sm-12'>
<div class="form-group">
<div class='input-group date' id='datetimepicker1'>
<input class="date-picker form-control" placeholder="Start Time" id="spstarttimetxt" name="spstarttimetxt" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idspstarttimetxt">End Time<span style="color: red">*</span> :</label>
<div class="row">
<div class='col-sm-12'>
<div class="form-group">
<div class='input-group date' id='datetimepicker1'>
<input class="date-picker form-control" placeholder="End Time" id="spendtimetxt" name="spendtimetxt" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idsptargetcritxt">Target Criteria<span style="color: red">*</span> :</label>
<br />
</div>
<div style="margin:30px;">
<div class="form-group ">
<label class="control-label col-sm-4" for="idspstarttxt">Start</label>
<input type="radio" name="srptargetcriradio" id="spstartradio" onclick="document.getElementById('spvaluetxt').style.display = 'none';">
</div>
<div class="form-group ">
<label class="control-label col-sm-4" for="idspchagingtxt">Chaging</label>
<input type="radio" name="srptargetcriradio" id="spchagingradio" onclick="document.getElementById('spvaluetxt').style.display = 'none';">
</div>
<div class="form-group ">
<label class="control-label col-sm-4" for="idspendtxt">End</label>
<input type="radio" name="srptargetcriradio" id="spendradio" onclick="document.getElementById('spvaluetxt').style.display = 'none';">
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idsptargetcritxt">Value</label>
<input type="radio" name="srptargetcriradio" id="spvalueradio" onclick="document.getElementById('spvaluetxt').style.display = 'block';">
<input type="number" min="0" class="form-control" placeholder="Value" id="spvaluetxt" name="spvaluetxt" required="required" style="display:none;" />
</div>
</div>
<button class="btn btn-primary nextBtn btn-lg pull-right" name="spsubmit" id="spsubmit" type="button">Submit</button>
}
</div>
</div>
</div>
</div>
<div class="col-md-9 well admin-content" id="targetpromotion">
<div class="row setup-content" id="step-1">
<div class="col-xs-8 col-md-offset-2">
#using (Html.BeginForm("TargetPromotion", "PromotionAdmin", FormMethod.Post, new { #class = "form-group", enctype = "multipart/form-data", id = "TargetsubmitForm" }))
{
#Html.AntiForgeryToken()
<div class="col-md-12">
<div class="form-group">
<label class="control-label" for="idtpchgpointtxt">Charge Point ID<span style="color: red">*</span> :</label>
<input class="form-control" placeholder="Charge Point" id="tpchgpointid" name="tpchgpointid" required="required">
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idtpmessagetxt">Message<span style="color: red">*</span> : </label>
<textarea class="form-control" id="spmessage" placeholder="Message" name="tpmessage" rows="5" required="required"></textarea>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idtpstarttimetxt">Start Time<span style="color: red">*</span> :</label>
<div class="row">
<div class='col-sm-12'>
<div class="form-group">
<div class='input-group date' id='datetimepicker1'>
<input class="date-picker form-control" placeholder="Start Time" id="tpstarttimetxt" name="tpstarttimetxt" required="required" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idtpstarttimetxt">End Time<span style="color: red">*</span> :</label>
<div class="row">
<div class='col-sm-12'>
<div class="form-group">
<div class='input-group date' id='datetimepicker1'>
<input class="date-picker form-control" placeholder="End Time" id="tpendtimetxt" name="tpendtimetxt" required="required" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idtptargetcritxt">Target Criteria<span style="color: red">*</span> :</label>
<br />
</div>
<div style="margin:30px;">
<div class="form-group ">
<label class="control-label col-sm-4" for="idtpstarttxt">Start</label>
<input type="radio" name="srptargetcriradio" id="tpstartradio" onclick="document.getElementById('tpvaluetxt').style.display = 'none';">
</div>
<div class="form-group ">
<label class="control-label col-sm-4" for="idtpchagingtxt">Chaging</label>
<input type="radio" name="srptargetcriradio" id="tpchagingradio" onclick="document.getElementById('tpvaluetxt').style.display = 'none';">
</div>
<div class="form-group ">
<label class="control-label col-sm-4" for="idtpendtxt">End</label>
<input type="radio" name="srptargetcriradio" id="tpendradio" onclick="document.getElementById('tpvaluetxt').style.display = 'none';">
</div>
<div class="form-group">
<label class="control-label col-sm-4" for="idtpptargetcritxt">Value</label>
<input type="radio" name="srptargetcriradio" id="tpvalueradio" onclick="document.getElementById('tpvaluetxt').style.display = 'block';">
<input type="number" min="0" class="form-control" placeholder="Value" id="tpvaluetxt" name="tpvaluetxt" required="required" style="display:none;" />
</div>
</div>
<button class="btn btn-primary nextBtn btn-lg pull-right" name="tpsubmit" type="button">Submit</button>
</div>
}
</div>
</div>
</div>
I'm calling PromotionAdmin Controller I'm calling following two methods
[CustomAuthorize(Roles = "admin")]
[HttpPost]
public ActionResult SpotPromotion(string spchgpointid, string spmessage, string spstarttimetxt, string spendtimetxt, string spstartradio, string spchagingradio, string spendradio, string spvalueradio)
{
string filename = "5fa9d4e9-c2ee-4d34-8d83-a83a60ffa49d.xls";
string couponfrom = "zcc";
List<ChgPoint> ch = new List<ChgPoint>();
ch = SpotControllerCRUD.GetAllChagePoint();
return View("Index");
}
[CustomAuthorize(Roles = "admin")]
[HttpPost]
public ActionResult TragetPromotion(string tpchgpointid, string tpmessage, string tpstarttimetxt, string tpendtimetxt, string tpstartradio, string tpchagingradio, string tpendradio, string tpvalueradio)
{
string filename = "5fa9d4e9-c2ee-4d34-8d83-a83a60ffa49d.xls";
string couponfrom = "zcc";
List<ChgPoint> ch = new List<ChgPoint>();
ch = SpotControllerCRUD.GetAllChagePoint();
return View("Index");
}
but when press the submit button it didn't went to action method
Change the type = "submit" instead of "button".
If the type is button you will have to specify its action.
I am using Webdriver C#, there is a drop down on the form. It's id value is dynamic
id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52311_3_52311_3_DDL"
the number: 52311 changes every time the form is opened.
How do i select the item in the drop down?
I have tried the following code - I want to select Switzerland value in the drop down:
Thanks,
IWebElement dropDownListBox =
<form id="aspnetForm" enctype="multipart/form-data" action="/33985/quality-assurance-committee/472/application" method="post" name="aspnetForm">
<input id="__EVENTTARGET" type="hidden" value="" name="__EVENTTARGET"/>
<input id="__EVENTARGUMENT" type="hidden" value="" name="__EVENTARGUMENT"/>
<input id="__VIEWSTATE" type="hidden" value="/wEPDkPz/fw==" name="__VIEWSTATE"/>
<input id="__EVENTVALIDATION" type="hidden" value="/wEWOfc=" name="__EVENTVALIDATION"/>
<div/>
<script type="text/javascript"> //<![CDATA[ var theForm = document.forms['aspnetForm']; some javascript code here </script>
<div class=""/>
<div id="ctl00_uxFormTemplate" question="" gotoarray="">
<nav class="navbar navbar-static-top navbar-default" container="false" role="navigation">
<div id="page-container" class="container">
<div class="">
<div>
<div id="ctl00_uxFormTemplate_uxErrorControl" class="container" question="" gotoarray=""/>
<div class="container">
<div id="content-container" class="col-md-12">
<div id="ctl00_uxFormTemplate_uxBreadCrumbNavigationControl" class="breadcrumb- container col-md-12 nopadding" question="" gotoarray="">
<div class="form-horizontal">
<div id="ctl00_uxFormTemplate_uxApplicationControl" question="" gotoarray="">
<h1 class="borderbottom">Question</h1>
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl" class="questions-container" question="" gotoarray="">
<span/>
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52309_1" class="question-control form-group" question="52309" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52310_2" class="question-control form-group" question="52310" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52311_3" class="question-control form-group" question="52311" gotoarray="{}" style="display: block;">
<div class="col-md-5">
<div class="col-md-7">
<select id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52311_3_52311_3_DDL" class="form-control" name="ctl00$uxFormTemplate$uxApplicationControl$uxQuestionControl$52311_3$52311_3_DDL">
</div>
</div>
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52312_4" class="textbox question-control form-group" question="52312" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52313_5" class="image-container image-container question-control form-group" question="52313" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52314_6" class="form-group question-control" question="52314" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52315_7" class="question-control form-group" question="52315" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52316_9" class="question-control form-group text" question="52316" gotoarray="{}" style="display: block;">
<div id="ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_52317_11" class="form-group question-control" question="52317" gotoarray="{}" style="display: block;">
<input id="error-count" type="hidden" value="0"/>
</div>
<input id="error-count" type="hidden" value="0"/>
</div>
</div>
<div id="ctl00_uxFormTemplate_uxNavigationControl" class="col-md-12 nopadding" question="" gotoarray="">
</div>
</div>
</div>
<div class="col-md-12"/>
<div class="col-md-6">
<div class="col-md-6">
</div>
</div>
This should work for you:
IWebElement selectElement = driver.FindElement(By.CssSelector("select[id^='ctl00_uxFormTemplate_uxApplicationControl_uxQuestionControl_']"));
SelectElement select = new SelectElement(selectElement);
select.SelectByText("Switzerland");