I am working on an ASP.NET Core MVC project. I currently have my index view page and home controller working. The only issue I'm having is whenever I click on the Search button, the results will display in a new tab. I've tried changing
<button type="submit" id="searchButton> Search </button>
to
<input type="submit" value="Search"/>
and that didn't work. I'm trying to figure out if there is a way to make the results appear on the same window. Any help is appreciated.
View:
@model IEnumerable<Officer>
@{
ViewData["Title"] = "FLIP";
Layout = "_Layout";
}
<meta name="vs_defaultClientScript" content="JavaScript" />
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5" />
<meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0" />
<meta name="ProgId" content="VisualStudio.HTML" />
<meta name="Originator" content="Microsoft Visual Studio.NET 7.0" />
<base target="mainpage" />
<!--Header-->
<!--Body of the page-->
<html>
<head>
<title>@ViewData["Title"]</title>
</head>
<hr style="width:75%" />
<body>
<form id="SearchForm" asp-controller="Home" asp-action="Search">
<div class="full-width">
<table border="0">
<tr>
<td vAlign="top" width="400" bgColor="aliceblue">
<h6>
<Font face="Arial" size="2">
DIRECTIONS: To find an interpreter . . .
</Font>
<!-- controls for specifying the required Agency ID or name --><br>
</h6>
<p>
@{
Html.RenderPartial("~/Views/Shared/LanguageList.cshtml");
}
<br />
<Font face="Arial" size="2">
2) Enter one of the following, if you want to restrict your search:
</Font>
<table>
<tr>
<td align="right">City: </td>
<td>
<input type="text" id="city" name="city" maxlength="100" colmuns="20" width="200">
</td>
</tr>
<tr>
<td align="right">State: </td>
<td>
<select name="State" id="State">
<option Value=""> Select a State . . .</option>
<option value="DE">Delaware</option>
<option value="DC">District of Columbia</option>
<option value="IN">Indiana</option>
<option value="MD">Maryland</option>
<option value="MI">Michigan</option>
<option value="NJ">New Jersey</option>
<option value="NY">New York</option>
<option value="OH">Ohio</option>
<option value="PA">Pennsylvania</option>
<option value="VA">Virginia</option>
<option value="ON">Ontario</option>
<option value="QC">Quebec</option>
</select>
</td>
</tr>
<tr>
<td align="right">Zip: </td>
<td>
<input type="text" id="zip" name="zip" maxlength="5" colmuns="20" width="100">
</td>
</tr>
<tr>
<td>
<br />
<button type="submit" id="searchButton" >Search</button>
</td>
</tr>
</table>
<br />
<p>@ViewBag.errorMessage</p>
<td>
<FONT face="Arial" size="2">
<p>This program was designed by MAGLOCLEN to assist investigators
dealing with issues of foreign languages<br>
by providing access to information on law enforcement officers with language
<br>
skills.
</p>
<p>To find an interpreter:</p>
<ol>
<li>Select a language from the picklist on the left.</li>
<li>[Optional] Limit your search by an area surrounding your zip code. This will<br>
narrow the list of speakers for the language you selected to those geographically<br>
closest to the zip code you enter.
</li>
</ol>
<p>To enter information on yourself or someone in your agency who speaks a language:</p>
<ol>
<li>Click on "Administer Agency" and search for your agency.</li>
<li>
Follow the instructions provided to enter a speaker, language, and contact information
</li>
</ol>
<p>Thank you for participating in this program. MAGLOCLEN hopes it is useful to you and your agency.
Please feel free to use the "Contact" tab at the top of this page to provide feedback.
</p>
</font>
</td>
</p>
</td>
</tr>
</table>
</div>
</form>
@if (Model != null && Model.Any())
{
<br />
<h6>Click details link in the grid below to list detail information on how to contact the officer.</h6>
<!--<h6 style="margin-left:-250px;">Click a Column Heading to sort the grid</h6>-->
<table class="table table-bordered table-striped" style="width:75%;
background-color: white; border:1px solid black;">
<thead>
<tr>
<th>Officer</th>
<th>Fluency</th>
<th>Phone</th>
<th>Extension</th>
<th>Cell Phone</th>
<th>City</th>
<th>State</th>
<th>Zip Code</th>
<th>Agency</th>
<th>Address</th>
<th>Date Modified</th>
</tr>
</thead>
@foreach (var officer in Model)
{
<tr>
<td>
@officer.FirstName
@officer.LastName
</td>
<td>@officer.Fluency</td>
<td>@officer.Phone</td>
<td>@officer.Ext</td>
<td>@officer.Cell</td>
<td>@officer.City</td>
<td>@officer.State</td>
<td>@officer.PostalCode</td>
<td>@officer.AgencyName</td>
<td>@officer.Address1</td>
<td>@officer.DateUpdated</td>
<td>
<a asp-action="Details" asp-route-id="@officer.OfficerKey">Details</a>
</td>
</tr>
}
</table>
}
<script src=https://code.jquery.com/jquery-3.6.0.min.js></script>
<script>
$('#State').click(function () {
$('#searchForm').button();
});
</script>
<style>
.body-container {
/*remove the container default padding attribute*/
/*padding-left: 0px !important;
padding-right: 0px !important;*/
/*increase width as per your need*/
max-width: 100%;
}
</style>
</body>
</html>
Controller:
public IActionResult Index()
{
return View();
}
//Get Officer from search
[HttpPost]
public IActionResult Search( SearchQueryModel searchQuery )
{
MailkitErrors errors = new(ServiceProvider!, Configuration!);
UserEmail = HttpContext.Session.GetString("UserEmail")!;
string ConnectionString = connectionStrings.Get( "ForeignLanguageConnectString" );
var objConnect = new SqlConnection( ConnectionString );
var objDataSet = new DataSet();
string strQuery = "SearchLanguageByMany";
try
{
//NO Language is selected
if (searchQuery == null || searchQuery.LanguageName == null)
{
ViewBag.errorMessage = "Please select a language from the drop-down menu, then click search";
return View("Index");
}
//Language is selected
var objCommand = new SqlCommand( strQuery, objConnect );
objCommand.CommandType = CommandType.StoredProcedure;
objCommand.CommandTimeout = 360;
objCommand.Parameters.AddWithValue( "@State", searchQuery.State );
objCommand.Parameters.AddWithValue( "@LanguageName", searchQuery.LanguageName );
objCommand.Parameters.AddWithValue( "@City", searchQuery.City );
objCommand.Parameters.AddWithValue( "@Zip", searchQuery.Zip );
var objDataAdapter = new SqlDataAdapter( objCommand );
objDataAdapter.Fill( objDataSet, "Officer" ); //FLIPV2 dbo.Officer table
}
catch (Exception)
{
ViewBag.ErrorMessage = "There has been an error. MAGLOCLEN HelpDesk has been notified.";
errors.ErrorEmails(UserEmail, "Error retrieving officers:\n");
}
List<Officer> Officers = new List<Officer>();
foreach (DataRow row in objDataSet.Tables[ "Officer" ]!.Rows)
{
Officer ofc = new Officer();
if (row[ "OfficerKey" ] is DBNull) ofc.OfficerKey = 0;
else ofc.OfficerKey = (int)row[ "OfficerKey" ];
if (row[ "AgGuid" ] is DBNull) ofc.AgGuid = Guid.Empty;
else ofc.AgGuid = (Guid)row[ "AgGuid" ];
if (row[ "AgencyName" ] is DBNull) ofc.AgencyName = "";
else ofc.AgencyName = (string)row[ "AgencyName" ];
if (row[ "OfficerRank" ] is DBNull) ofc.OfficerRank = "";
else ofc.OfficerRank = (string)row[ "OfficerRank" ];
if (row[ "FirstName" ] is DBNull) ofc.FirstName = "";
else ofc.FirstName = (string)row[ "FirstName" ];
if (row[ "LastName" ] is DBNull) ofc.LastName = "";
else ofc.LastName = (string)row[ "LastName" ];
if (row[ "Fluency" ] is DBNull) ofc.Fluency = "";
else ofc.Fluency = (string)row[ "Fluency" ];
if (row[ "Phone" ] is DBNull) ofc.Phone = "";
else ofc.Phone = (string)row[ "Phone" ];
if (row[ "Ext" ] is DBNull) ofc.Ext = "";
else ofc.Ext = (string)row[ "Ext" ];
if (row[ "Cell" ] is DBNull) ofc.Cell = "";
else ofc.Cell = (string)row[ "Cell" ];
if (row[ "Address1" ] is DBNull) ofc.Address1 = "";
else ofc.Address1 = (string)row[ "Address1" ];
if (row[ "City" ] is DBNull) ofc.City = "";
else ofc.City = (string)row[ "City" ];
if (row[ "State" ] is DBNull) ofc.State = "";
else ofc.State = (string)row[ "State" ];
if (row[ "Country" ] is DBNull) ofc.Country = "";
else ofc.Country = (string)row[ "Country" ];
if (row[ "PostalCode" ] is DBNull) ofc.PostalCode = "";
else ofc.PostalCode = (string)row[ "PostalCode" ];
if (row[ "Email" ] is DBNull) ofc.Email = "";
else ofc.Email = (string)row[ "Email" ];
if (row[ "DateUpdated" ] is DBNull) ofc.DateUpdated = System.DateTime.MinValue;
else ofc.DateUpdated = (System.DateTime)row[ "DateUpdated" ];
if (row[ "UserUpdated" ] is DBNull) ofc.UserUpdated = "";
else ofc.UserUpdated = (string)row[ "UserUpdated" ];
if (row[ "Address2" ] is DBNull) ofc.Address2 = "";
else ofc.Address2 = (string)row[ "Address2" ];
Officers.Add( ofc );
}
return View( "Index", Officers );
}
You should remove/comment this line.
<base target="mainpage" />
In addition, I recommend using ajax local refresh, which does not refresh all the Index pages.