Click on a button by Identifying nearby Element - selenium

Name Mobile No Introducer Created On Status Action
Adill 6666655555 Nitesh 05-02-2014 Pending For Approval [button]
Adill 6666644444 Nitesh 05-02-2014 Pending For Approval [button]


the situation is like this, I want to click on buttons by checking their unique mobile no. 
let suppose I want to click on button2 where mobile number is 666644444. So How can I perform this thing ?
enter code here :
<tr class="even">
<td class="">Adil Imroz</td>
<td class="">999933333</td>
<td class="">Adil</td>
<td class=" sorting_1">04-02-2014</td>
<td class="">
<span class="undefined">Pending For Approval</span>
</td>
<td class="">
<a id="editCustomerDetails" class="btn btn-info btn-small" onclick="showUpdateForm(2);">
<i class="halflings-icon edit halflings-icon"/>
</a>
</td>
</tr>
<tr class="odd">
<td class="">Adil Imroz</td>
<td class="">9999444444</td>
<td class="">Adil</td>
<td class=" sorting_1">04-02-2014</td>
<td class="">
<span class="undefined">Pending For Approval</span>
</td>
<td class="">
<a id="editCustomerDetails" class="btn btn-info btn-small" onclick="showUpdateForm(3);">
</td>

Related

How To Make A Loop Using v-for With Condition "Like Forelse" In Laravel Framework

I'm Just Trying To Do Something using Vue Similar To forelse in laravel framework blade,
This Is Just To Do a Test To Confirm If Table Has Records Or Not, If No, It Allows Me To Add A Default Value Like :
<tr>
<td colspan="4">There's No Records Yet</td>
</tr>
I Tried This But It Gives Me [vue/no-use-v-if-with-v-for]
<tr v-for="(category, index) in this.categories" :key="index" v-if="categories">
<td>{{ category.id }}</td>
<td>{{ category.name }}</td>
<td style="width: 20%;">
<img :src="`${$store.state.baseUrl}/storage/${category.image}`" style="width: 100%;" :alt="category.name">
</td>
<td>
<button type="button" class="btn btn-danger" #click="deleteCategory(category)"><i class="fa fa-trash"></i></button>
<i class="fa fa-edit"></i>
</td>
</tr>
<tr v-else>
<th colspan="4" class="text-center">There's No Reacoards Yet</th>
</tr>
Is There Anyone Has A Solution For This Issue,
Thank You
- Muhammed Elfeqy
This is one of the times where you want to use the invisible <template> element
For example
<template v-if="categories.length > 0">
<tr v-for="category in categories" :key="category.id">
<!-- and so on -->
</tr>
</template>
<tr v-else>
<td colspan="4">There's No Records Yet</td>
</tr>

How to display data according to Package like Platinum,Gold,Silver in ASP.NET MVC 4

In Package table which is Tbl_Package I have columns PackageID,PackageName,Orderno.
For Platinum Orderno is 1,for Gold it is 2,Silver 3.
I have another table for Patients Tbl_Patientinfo in which I have columns PatientID,PatientName,
PackageID,PackageName .
According to Package patients should be displayed in platinum all platinum member patients should be displayed,In gold all gold member patients so on for silver my query is below
ALTER Proc [dbo].[Sp_Get_AppointmentRequest_Data]
as begin
select a.PatientID,a.PatientName,b.PackageID,b.PackageName,b.Orderno from Tbl_Patientinfo as a
left join Tbl_Packageinfo as b on a.PatientID=b.PackageID
order by PatientID desc
end
and in my view
<h2>Platinum</h2>
<div class="sparkline8-graph">
<div class="static-table-list">
<table class="table">
<thead>
<tr class="headings">
<th class="column-title">SNO</th>
<th class="column-title">Patient Name</th>
<th class="column-title">Package</th>
<th class="column-title">Mobile</th>
<th class="column-title">Address</th>
<th class="column-title">Date</th>
<th class="column-title">Manage</th>
</tr>
</thead>
<tbody>
#{
if (Model.PatientList == null || Model.PatientList.Count() == 0)
{
<tr>
<td style="color: #ff0000;">No results found!</td>
</tr>
}
else
{
foreach (var item in Model.PatientList)
{
<tr class="even pointer">
<td class=" ">#item.RowNumber</td>
<td class=" ">#item.PatientName</td>
<td class=" ">#item.PackageName</td>
<td class=" ">#item.Mobileno</td>
<td class=" ">#item.Address</td>
<td class=" ">#item.Date</td>
<td class=" ">
<i class="fa fa-pencil"></i>Edit
<i class="glyphicon glyphicon-remove"></i>Delete
</td>
</tr>
}
}
}
</tbody>
</table>
</div>
</div>
for gold and silver same as above
How should i Display patients separately according to package?
You are fetching all member from the table, If you want to filter only platinum member from fetched record and display in razor view, You can set the condition
#foreach(var item in Model.PatientList)
{
#if(#item.PackageID == 1)
{
<tr class="even pointer">
<td class=" ">#item.RowNumber</td>
<td class=" ">#item.PatientName</td>
<td class=" ">#item.PackageName</td>
<td class=" ">#item.Mobileno</td>
<td class=" ">#item.Address</td>
<td class=" ">#item.Date</td>
<td class=" ">
<i class="fa fa-pencil"></i>Edit
<i class="glyphicon glyphicon-remove"></i>Delete
</td>
</tr>
}
}

How can select (or click) the button in table

I have a table as below with two buttons, how can I select the button for the 'FIRST' row?
<table id="comms-table" class="table table-condensed">
<tbody>
<tr><th class="bordered" style="text-align: center;" width="50">Status</th><th class="bordered" width="130">Component</th><th class="bordered">Last heart-beat</th></tr>
<tr class="data_row">
<td style="text-align: center;"><button class="btn btn-mini btn-success"> </button></td>
<td class="bordered">FIRST</td>
<td class="bordered">5 seconds ago</td>
</tr>
<tr class="data_row">
<td style="text-align: center;"><button class="btn btn-mini btn-success"> </button></td>
<td class="bordered">SECOND</td>
<td class="bordered">17 seconds ago</td>
</tr>
</tbody>
</table>
Try this:
WebElement we = driver.findElement(By.xpath("//*[contains(text(),'FIRST')]/preceding::button[1]"));
we.click();

What can I do to see all the contents of my page when screens are smaller

I am new to bootstrap. What can I do to see all the contents of my page when screens are smaller. My table in Activities panel doesn't adjust with the screen size.I have a div named MiddleDiv where I append 1 or more tables on the fly.
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 col-xs-12">
<div class="panel panel-primary">
<div class="panel-heading">Activities</div>
<div class="panel-body">
<div class="table-responsive" id="MiddleDiv">
<table width="100%" style="margin-bottom:10px" id="Table_1" class="TableBlankClass table">
<tbody>
<tr class="bg-success">
<td style="font-weight:bold" id="ActivityCompany_1" colspan="3">Company(Bill to): TD General Insurance Company</td>
<td style="font-weight:bold" id="ActivityClient_1" colspan="6">Client: Test Adjsuter</td>
</tr>
<tr>
<td colspan="3">
<table width="100%">
<tbody>
<tr>
<td><button class="btn btn-danger btn-xs" id="ActivityDel_1" onclick="DelActivity('Table_1')" type="button">Del</button></td>
<td class="ActivitiesHeading">Activity</td>
<td>
<select onchange="GetRate('Table_1')" id="ActivityTypeDropDown_1" style="width:200px;" class="form-control TableSelectClass">
<option value="- Select One -" selected="">- Select One -</option>
<option value="Accomodation">Accomodation</option>
</select>
</td>
</tr>
</tbody>
</table>
</td>
<td class="ActivitiesHeading">Comments</td>
<td colspan="2" class="ActivitiesHeading"><textarea rows="1" style="width: 275px; height: 35px;" class="form-control" id="ActivityComments_1"></textarea></td>
<td class="ActivitiesHeading">Status<span id="ActivitySpan_1"></span></td>
<td colspan="2" class="ActivitiesHeading">
<select onchange="CalculateActivities(); CreateRemoveReasonButton('Table_1');" id="ActivityStatusDropDown_1" style="width:200px;" class="form-control">
<option value="24859" selected="">Waiting To Process Payer Invoice</option>
</select>
</td>
</tr>
<tr>
<td class="ActivitiesHeading">Rate</td>
<td class="ActivitiesHeading">Qty</td>
<td class="ActivitiesHeading">Discount</td>
<td class="ActivitiesHeading">Discount %</td>
<td class="ActivitiesHeading">Reason For Discount</td>
<td class="ActivitiesHeading">Tax Applicable</td>
<td class="ActivitiesHeading">Taxes</td>
<td class="ActivitiesHeading">SubTotal</td>
<td class="ActivitiesHeading">Gross Total</td>
</tr>
<tr>
<td><input type="text" onblur="if (this.value=='') {this.value = 0;}" value="0" onkeyup="CalculateActivities()" id="ActivityRate_1" class="form-control TableNumericClass"></td>
<td><input type="text" onblur="if (this.value=='' || this.value=='0') {this.value = 1;}" value="1" onkeyup="CalculateActivities()" id="ActivityQty_1" class="form-control TableNumericClass"></td>
<td><input type="text" onblur="if (this.value=='0') {this.value = '';}" value="" onkeyup="CalculateActivities()" id="ActivityDiscount_1" class="form-control TableDiscountClass"></td>
<td><input type="text" onblur="if (this.value=='0') {this.value = '';}" value="" onkeyup="CalculateActivities()" id="ActivityDiscountPercentage_1" class="form-control TableDiscountClass"></td>
<td>
<select id="ReasonForDiscountDropDown_1" class="form-control">
<option value="- Select One -" selected="">- Select One -</option>
<option value="Late Report Delivery">Late Report Delivery</option>
<option value="Incorrect File Management">Incorrect File Management</option>
<option value="Client Satisfaction">Client Satisfaction</option>
<option value="Other - See Service Notes">Other - See Service Notes</option>
</select>
</td>
<td>
<select onchange="CalculateActivities()" id="ActivityTaxApplicable_1" class="form-control">
<option value="Yes" selected="">Yes</option>
<option value="No">No</option>
</select>
</td>
<td><img width="15" height="15" title="<body> <table width="150px" border="0" cellspacing="1" cellpadding="1"> <tr> <td class="ToolTipTableClass">Tax1 :</td> <td class="ToolTipTableClass">0.00</td> </tr> <tr> <td class="ToolTipTableClass">Tax2 :</td> <td class="ToolTipTableClass" >0.00</td> </tr> </table> </body>" src="/files/404048/93171/Info-32.png" id="ActivityTaxesAmount_1" class="TaxesClass" data-original-title="<body> <table width="150px" border="0" cellspacing="1" cellpadding="1"> <tr> <td class="ToolTipTableClass">Tax1 :</td> <td class="ToolTipTableClass"></td> </tr> <tr> <td class="ToolTipTableClass">Tax2 :</td> <td class="ToolTipTableClass" ></td> </tr> </table> </body>"></td>
<td id="ActivitySubTotal_1">100.00</td>
<td id="ActivityGrossTotal_1">100.00</td>
</tr>
<tr>
<td class="ActivitiesHeading">Measure</td>
<td colspan="2" class="ActivitiesHeading">GAP Code</td>
<td colspan="3" class="ActivitiesHeading">Other Description</td>
<td colspan="3" class="ActivitiesHeading"> </td>
</tr>
<tr>
<td>
<select id="ActivityMeasure_1" class="form-control">
<option selected="" value="- Select One -">- Select One -</option>
</select>
</td>
<td colspan="2">
<select id="ActivityGAPCode_1" class="form-control">
<option value="00000" selected=""><-Select One-></option>
</select>
</td>
<td colspan="3"><input type="text" id="ActivityOtherDescription_1" class="form-control"></td>
<td colspan="3">
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 col-xs-12">
<div class="panel panel-primary">
<div class="panel-heading">Total</div>
<div class="panel-body">
<div class="table-responsive">
<table width="100%" class="table">
<tbody>
<tr>
<td class="HeadingTD">SubTotal</td>
<td id="AllSubTotal"></td>
<td class="HeadingTD">Discount</td>
<td id="AllDiscount"></td>
<td class="HeadingTD">Tax</td>
<td id="AllTax"></td>
<td class="HeadingTD">Gross Total</td>
<td id="AllGrossTotal"></td>
</tr>
<tr>
<td colspan="2" id="AddItemTD"></td>
<td colspan="2" id="SubmitActivitiesTD"></td>
<td colspan="2" id="VoidInvoiceTD"></td>
<td colspan="2" align="right"><button class="btn btn-primary btn-sm" onclick="window.parent.close()" type="button">Close</button></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
I can see you are just wrapping traditional HTML tables with some bootstrap classes expecting them to be responsive.
It's a good start but you need to rethink how you construct your tables when you use bootstrap.
Bootstrap uses their "Grid System" http://getbootstrap.com/css/#grid
The grid system doesn't use tables at all. It uses divs with specific classes on them achieve the layout you are looking for. Until you fully use the bootstrap grid system you will not truly see a responsive design.
Take the time to learn the bootstrap grid system.
A bit of a side note and personal opinion: Looking at your form design (which looks great btw) you might not like the result of a responsive design. All of the form fields will end up stacking on top of each other. This form design really only works horizontally. If it were vertically aligned it might get very confusing. If it were me, I might design the form to fit interfaces as small as a tablet but not mobile.

Selenium RC - Having difficulty with Selenium IDE to find a table cell

I hope someone here can help me. Im using selenium to test a page that has an image which when click displays a calendar. I can get as far as clicking the image using
browser.click("//center/table/tbody/tr/td[1]/a/img")
I got the above path by using the Selenium IDE. The problem is once i click the above image the Selenium IDE does not record what i have clicked after the calendar is shown.
Here is the code for the image button
<INPUT size='8' CLASS="field-date" TYPE="text" NAME="endQtrDate" VALUE="01/10/2004" ID="endQtrDate" onBlur="this.value=validateFieldValue(this.value,'date_error','endQtrDate',this.form)" onFocus="this.select()" TITLE="Enter date in format dd/mm/yyyy" />
<IMG ALIGN="absmiddle" ALT="Press to show calendar picker" NAME="calendarButton" SRC="../images/buttons/small/calendar.gif" onClick="return showCalendar('endQtrDate', 'dd/MM/yyyy');" />
Unfortunately i cant see the code for the calendar after i click it. The only way i can see it is using the mozilla plugin "Firebug". I managed to get the div layer of which the calendar is displayed.
<div class="calendar"
style="position: absolute; display: none; left: 234px; top: 416px;">
<table cellspacing="0" cellpadding="0">
<thead>
<tr>
<td colspan="1" class="button">-</td>
<td colspan="6" class="title" style="cursor: move;">October,
2004</td>
<td colspan="1" class="button">×</td>
</tr>
<tr class="headrow">
<td colspan="1" class="button">«</td>
<td colspan="1" class="button">‹</td>
<td colspan="4" class="button">Today</td>
<td colspan="1" class="button">›</td>
<td colspan="1" class="button">»</td>
</tr>
<tr class="daynames">
<td class="name wn">wk</td>
<td class="day name">Mon</td>
<td class="day name">Tue</td>
<td class="day name">Wed</td>
<td class="day name">Thu</td>
<td class="day name">Fri</td>
<td class="name day weekend">Sat</td>
<td class="name day weekend">Sun</td>
</tr>
</thead>
<tbody>
<tr class="daysrow">
<td class="day wn">40</td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day">1</td>
<td class="day weekend">2</td>
<td class="day weekend">3</td>
</tr>
<tr class="daysrow">
<td class="day wn">41</td>
<td class="day">4</td>
<td class="day">5</td>
<td class="day">6</td>
<td class="day">7</td>
<td class="day">8</td>
<td class="day weekend">9</td>
<td class="day weekend">10</td>
</tr>
<tr class="daysrow">
<td class="day wn">42</td>
<td class="day">11</td>
<td class="day">12</td>
<td class="day">13</td>
<td class="day">14</td>
<td class="selected day">15</td>
<td class="day weekend">16</td>
<td class="day weekend">17</td>
</tr>
<tr class="daysrow">
<td class="day wn">43</td>
<td class="day">18</td>
<td class="day">19</td>
<td class="day">20</td>
<td class="day">21</td>
<td class="day">22</td>
<td class="day weekend">23</td>
<td class="day weekend">24</td>
</tr>
<tr class="daysrow">
<td class="day wn">44</td>
<td class="day">25</td>
<td class="day">26</td>
<td class="day">27</td>
<td class="day">28</td>
<td class="day">29</td>
<td class="day weekend">30</td>
<td class="day weekend">31</td>
</tr>
<tr class="emptyrow">
<td class="day wn">36</td>
<td class="day">30</td>
<td class="day">31</td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
</tr>
</tbody>
<tfoot>
<tr class="footrow">
<td colspan="8" class="ttip" style="cursor: move;">Select date</td>
</tr>
</tfoot>
</table>
<div class="combo" style="display: none;">
<div class="label">Jan</div>
<div class="label">Feb</div>
<div class="label">Mar</div>
<div class="label">Apr</div>
<div class="label">May</div>
<div class="label">Jun</div>
<div class="label">Jul</div>
<div class="label">Aug</div>
<div class="label">Sep</div>
<div class="label">Oct</div>
<div class="label">Nov</div>
<div class="label">Dec</div>
</div>
<div class="combo" style="display: none;">
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
</div>
</div>
If you look carefully you will see table cells for dates from 1 to 30th. How can i access these values using Selenium? I can use the IDE as it doesnt record anything when the calendar pops up.
The firebug has an option to display the xpath of any tag. I tried it on one of the td tags and it says this is the xpath.
/html/body/div/table/thead/tr[2]/td[3]
Can i use the above path to determine its value then click on it using selenium?
Thanks
To click on the image you can use click | calendarButton and that should load it up for you.
From there you will then need to click on items I would then use firebug to see the other items on the page.
Edit from extra info:
What you need to do then is use xpath=//td[#class="day" and text()="14"] for xpath or for css use css=td.day:contains('14')
The css route will be a lot quicker in browsers like Internet Explorer