Long ago, there existed a project that held the attention of an individual. This particular project featured both a master page and a content page, where the latter boasted a drop-down list along with two text boxes. However, when an item name was selected from the drop-down list, to everyone's surprise, the values of totalQuantity and pricePerItem failed to show up in the text boxes! The person diligently worked on crafting web service and JavaScript code for this venture, but alas, it did not behave as intended. Thus, comes the humble request for your assistance.
public class QuantityAndPrice
{
public string totalQuantity { get; set; }
public string pricePerItem { get; set; }
}
webservice code
public class QuantityAndPriceService : System.Web.Services.WebService
{
[WebMethod]
public void GetQuantityAndPrice(string productName)
{
QuantityAndPrice quantityAndpriceObject = new QuantityAndPrice();
string connect_string = "datasource=localhost;port=3306;username=root;password=root;";
MySqlConnection connection = new MySqlConnection(connect_string);
string query = "select totalQuantity,pricePerItem from smart_shop.inventory where name='" + productName + "';";
MySqlCommand cmd = new MySqlCommand(query, connection);
connection.Open();
MySqlDataReader reader = cmd.ExecuteReader();
while (reader.Read())
{
quantityAndpriceObject.totalQuantity = reader.GetString("totalQuantity");
quantityAndpriceObject.pricePerItem = reader.GetString("pricePerItem");
}
JavaScriptSerializer js = new JavaScriptSerializer();
Context.Response.Write(js.Serialize(quantityAndpriceObject));
}
}
javascript
<script type="text/javascript">
$(document).ready(function () {
$('#productNameDDL').change(function () {
var pName = $('#productNameDDL').val();
$.ajax({
url: 'QuantityAndPriceService.asmx/GetQuantityAndPrice',
data: { productName: pName },
method: 'post',
dataType: 'json',
success: function (data) {
$('#tbxAvailableQuantity').val(data.totalQuantity);
$('#tbxPricePerItem').val(data.pricePerItem);
},
error: function (err) {
alert(err);
}
});
});
});
</script>and here aspx code
<div class="panel-body">
<div class="row">
<div class="col-md-6">
<h6> Available Qty</h6>
<asp:TextBox ID="tbxAvailableQuantity" CssClass="form-control" ReadOnly="true" runat="server"></asp:TextBox>
</div>
<div class="col-md-6">
<h6> Price/Item</h6>
<asp:TextBox ID="tbxPricePerItem" CssClass="form-control" ReadOnly="true" runat="server"></asp:TextBox>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<h6> Sales Qty</h6>
<asp:TextBox ID="tbxSalesQtuantity" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="col-lg-6">
<h6> Total Price</h6>
<asp:TextBox ID="tbxTotalPrice" CssClass="form-control" runat="server"></asp:TextBox>
</div>
</div>
</div>
<asp:DropDownList ID="productNameDDL" CssClass="form-control" runat="server"></asp:DropDownList>