When we’re working with long strings in application user interfaces
it distracts the user interfaces. Here is the example
In the above example there is paging grid with 10 rows per page.
The better way to represent the data, we can show first 250 characters for much
better user experience.
Solution for overcome of this sort of problems is provided some
of the data to get the idea.(or else without showing it J) , we can provide a link with
having two options. Showing more or less link with the paragraph (default less)
and user can toggle it.
Ok , now let come to development in angular. In angular we
can use pipes for that but their some limitation to do that. In this example I’m
going to component for that and reuse it. We can use Parent and Child component with
@Input for this.
ParentComponent.html
ChildComponent.html
ChildComponent.ts ("app-show-more" selector)
How to use it using npm package Step 1 :Install npm package npm install show-less-more-string Step 2 : import module import { ShowLessMoreStringModule} from 'show-less-more-string';
imports: [
BrowserModule,
AppRoutingModule,
ShowLessMoreStringModule
]
Step 3 :How to use <app-show-more[_longString]='YourString'[_length]=25> </app-show-more>
In production normally used lot of master data with separate
user interface for adding them. As an example if user goes to edit the employee
with remarks which is a dropdown to select the particular remark of the
control. What if the suggested remarks isn’t in the controller then user has to
go the particular screen to add the remark and then has to refresh the current
page for getting updated remarks.
In the above case what if it’s there any option for adding
remark to the control itself without refreshing the page. As a common solution
we can give common reusable interface for adding remark or whatever in to the control
with adding few properties.
What we have to it just double click the dropdown and add
items and it will updated the database and control itself with new data.
<selectid="cmbResignReasonCategory"
class="
addDropDown"
data-NatTableName="hrm.ResignReasonCategory"
data-NatColName="ResignReasonCategoryName">
</select>
Explanation
·class=" addDropDown"
This is
the key class for fire the double click event in the control
·data-NatTableName="hrm.ResignReasonCategory"
this is html5 data attribute for getting table name which is used to
populate the dropdown
·data-NatColName="ResignReasonCategoryName
oThis the table column name which is related to
the table.
This is the only configuration is needed for getting this
feature.
Technical
Explanation:
The entire idea is very simple, when double click the
control it is triggered the event which is used the following java script.
<script>
var NatDropDownAdd = function () {
this.NatTableName = '';
this.NatColName = '';
this.NatValue = '';
this.NatSavedID = 0;
}
var optionModl = function () {
this.text = '';
}
$(document).ready(function (e) {
$(document).on("dblclick", ".addDropDown", function (ee) {
debugger;
$("#CustomAddItem").modal();
$("#NatSave").removeAttr("data-NatControlID");
$("#NatSave").attr("data-NatControlID", $(this).attr('id'));
var name = [];
var input = $("#" + $(this).attr('id')).find("option").each(function (i) {
debugger;
if ($(this).val() != '0') {
var obj = new optionModl();
obj.text = $(this).text();
name.push(obj);
}
});
$("#NatGet").html('');
$("#NatGet").append(BindTable(name));
});
$(document).on("click", ".NatSave", function (ee) {
debugger;
var obj = new NatDropDownAdd();
Serverside [HttpPost]
public JsonResult SavedDropDownItemAdd(NatDropDownModel obj)
{
string s=" Insert into " + obj.NatTableName + " (" + obj.NatColName + ",EnteredBy,EnteredOn) values('" + obj.NatValue.ToUpper() + "'" ); SELECT CAST(scope_identity() AS int)";
int newID;
using (SqlConnection con = new SqlConnection("YOURCONNECTIONSTRING"))
{
using (SqlCommand insertCommand = new SqlCommand(s, con))
{
con.Open();
newID = (int)insertCommand.ExecuteScalar();
if (con.State == System.Data.ConnectionState.Open) con.Close();
Last few months I couldn’t blog any post; here is the first
one in 2015
When we are developing database driven application, INSERT,UPDATE
and DELETE operations are frequently used.in early we develop (write) entire
code to against the database eg. (create sqlconnection,command,Tansaction
object etc.).
Then ORM introduced by Microsoft which is Entity Framework
(other ORM tool also available Subsonic,nhibernate etc), It provides more flexibility
way to accessing data base. It also has some drawbacks (multiple database,
memory consumption etc).
This post is about the INSERT,UPDATE and DELETE with
SqlTransaction using common method to reduce code duplication and coding less
method to saving data in database.
Common Class:
public class Tra : IDisposable
{
SqlTransaction tra;
SqlConnection connection = null;
public Tra()
{
if (connection == null)
{
connection = new SqlConnection(sqlConnection);
}
}
public long Save(string query,bool isIdentity,CommandType cmdType, params SqlParameter[] paras)
Asp.net Data binding that provides much easy way to manipulate
data to the control eg.gridview,dropdownlist etc
I’ve notice when we are binding there are some unnecessary codes
Dropdownlist1.DataTextField
= "JObName";
Dropdownlist1.DataValueField
= "JobID"
Dropdownlist1.DataSource
= lstJobs;
Dropdownlist1.DataBind();
We’re calling DataBind() method to asking to binding.totaly
4 lines of codes is required to bind dropdownlist.what is if we have common
method to call to binding.
to find a way to overcome this issue in mind, I thought to
create common method to bind it .oh no situation getting will be worsen , have
to be specified to each of the control
to bind. Generic is there to solve my issue.
I wrote generic extension method to bind all controls…..
hi guys, today I’m going to demonstrate working with grid
view with different situations.asp.net provides much more flexible way to (tabular)
to represent data .keep it mind what
every server tags finally converted to the classical html code (GRIDview to
html table).
What is the easiest way to bind grid view?
1)Using Automaically Genarated columns
This method directly bind all the data source columns into
grid.(good for only display data)
2)BoundField
If you’re not working data key fields in bound filed
then you can’t able to get the selected cell value using column name , have to
work with index?
Working with index like calling to
trouble????????????????????
Above code snippet shows in yellow color, to mark the column
name as data key names. Then we can access the columns using data key names.
Eg. Int empID=(int)GridView1.DataKeys[0]["EmpNo"];
3)Template Filed
If we are using totally template fieds like lable,textbox it
also very secure (can access data via its id) way to working with data, but it
take times to develop. In exceptional scenario like add dropdown list then you’ll
have to use it.
Here with I’ve attached code which contained working with
selected dropdown item in grid view and events.
Happy coding.
(thre're more alternative way can find on internet)
Hi guys, today I’m going to demonstrate jquery alert box.
Recently I was received a project by manager and that is invoicing and payment system and i pointed out sometimes I also bit difficultly to entering the prices. , Because sometime I enter values incoreclty.to avoid the same issue to users, I decided to build the alert box to display the value in the text box.
easy configuration , just need to add the class="WordToNum" to textbox
<script src="https://code.jquery.com/jquery-git1.min.js"></script>
<script type="text/javascript">
var th = ['', 'thousand', 'million', 'billion', 'trillion'];
// uncomment this line for English Number System
// var th = ['','thousand','million', 'milliard','billion'];
var dg = ['zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine']; var tn = ['ten', 'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen']; var tw = ['twenty', 'thirty', 'forty', 'fifty', 'sixty', 'seventy', 'eighty', 'ninety']; function toWords(s) { s = s.toString(); s = s.replace(/[\, ]/g, ''); if (s != parseFloat(s)) return 'not a number'; var x = s.indexOf('.'); if (x == -1) x = s.length; if (x > 15) return 'too big'; var n = s.split(''); var str = ''; var sk = 0; for (var i = 0; i < x; i++) { if ((x - i) % 3 == 2) { if (n[i] == '1') { str += tn[Number(n[i + 1])] + ' '; i++; sk = 1; } else if (n[i] != 0) { str += tw[n[i] - 2] + ' '; sk = 1; } } else if (n[i] != 0) { str += dg[n[i]] + ' '; if ((x - i) % 3 == 0) str += 'hundred '; sk = 1; } if ((x - i) % 3 == 1) { if (sk) str += th[(x - i - 1) / 3] + ' '; sk = 0; } } if (x != s.length) { var y = s.length; str += 'point '; for (var i = x + 1; i < y; i++) str += dg[n[i]] + ' '; } return str.replace(/\s+/g, ' '); }
function JqueryAlertJS(message, id) {
$('#ff').remove();
var position = $('#' + id).position();
var top = position.top;
var l = position.left + $('#' + id).width() + 20;
// alert(l);
div = $("<div id='ff' class='ui-corner-all bubble me towords' style='color:white;z-index:500500; background-color:#e14f1c;position:absolute;top:" + position.top + "px;left:" + l + "px;'>").html(message);
//$("#numm").prepend(div);
$( "#numm" ).append(div );
Asp.net
that doesn't provide to display grid-view in empty. :)
Let’s
explain it in example
//dt=DataTable
which is empty .
Gridview1.DataSource=dt;
GridView1.DataBind();
Above mentioned code, that will not displayed gridview,
because of it is empty.to overcome to this issue we can use EmptyDataText="Data Not Found" propery in gridview.
it's better than displaying invisible gridview to user.
another option (much user friendly)
Binding user define datatable with one datarow.
DataTable dt = new DataTable();
dt.Columns.Add("Name");
dt.Columns.Add("ID");
DataRow dr;
dr = dt.NewRow();
dr["Name"] = "xx";
dr["ID"] = "xx";
dt.Rows.Add(dr);
GridView1.DataSource = dt;
GridView1.DataBind();
more efficient way
ShowHeaderWhenEmpty="true" property in gridview set to true.
and set the emptydataTemplate
<EmptyDataTemplate>
Data Not Found
</EmptyDataTemplate>
advantage : no need work with the datatable to display empty row.
Rain rain go away come aging another day oh no please don’t come
again. Rainy session has begun and flooded everywhere.
Today I’m going discuss about another issue in combobox
(windows app)
The problem was when we’re binding combobox , if there’re combo
selected index change event it will be triggered while data binding.to avoid
the issue , attach and detached the event handler.
this.cmbDyeJob.SelectedIndexChanged
+= new System.EventHandler(this.cmbDyeJob_SelectedIndexChanged);
cmb.DataSource = lst;
this.cmbDyeJob.SelectedIndexChanged
-= new System.EventHandler(this.cmbDyeJob_SelectedIndexChanged);
Solution 1
Add SelectionChangeCommitted instead
of SelectedIndexChanged Event.
In the 2ndsolution,
it fires the selected index change event but it’ll return after first line is
executed.(noted combobox should not be focused while binding)
In this post i'm going to discuss some of the tricks in .net application that I've used.to avoid unnecessary code lines , defensive programming are the required talent of the programmer.
1)Error handling with showing message
always write your code starting point within try catch block. eg. only for raise it event root (button click event) private void button1_Click(object sender, EventArgs e) { try { if (txtName.Text.Trim().Length == 0) { MessageBox.Show("Name is required"); return; } /// do some coding here } catch (Exception ex) { MessageBox.Show("Error"); } }.
above code is nothing wrong, but it used unnecessary return statements. private void button1_Click(object sender, EventArgs e) { try { if (txtName.Text.Trim().Length == 0) { throw new ApplicationException("Name is required"); } /// do some coding here } catch (ApplicationException ex) { MessageBox.Show(ex.Message); } catch (Exception ex) { MessageBox.Show("Error"); } }
Application level errors is captured by ApplicationException class.there're no any return and more clear and specific. 2) Windows application Stores object in textbox (suppose you want to display Employee name in text box and also required to hide Employee id form the screen.one textbox for employee and lable for empid which is invisible)
in Textbox has property called Tag , that can hold required data invisibly. Employee emp = new Employee() { ID = 11, Name = "NImal" }; //Assing txtName.Text = emp.Name; txtName.Tag = emp;//obj is employee related data eg.ID,DateJoind etc //retrive Employee empObje =(Employee) txtName.Tag; //////////////////////////////////// public class Employee { public string Name { get; set; } public int ID { get; set; }
} 3) add rows to DataGridView int i= dataGridView1.Rows.Add(); dataGridView1.Rows[i].Cells["Column1"].Value = 22;
dataGridView1.Rows[i].Cells["Column2"].Value = "SSS";
above code is to add new row to datagridview (which has 2 columns).nothing wrong it.what will happen if column names are changed.code will be complied at run time will be caused an error .because column names are not strongly type. dataGridView1.Rows is duplication among the code.to alternative this issue , here code snippet. DataGridViewRow gr =dataGridView1.Rows[dataGridView1.Rows.Add()]; gr.Cells[Column1.Name].Value = 22;
gr.Cells[Column2.Name].Value = "SSS"; 4)strongly type session and viewstate (asp.net)
in asp.net application we stored data as globally (session) and page level (view state).
eg. Session["abc"]=1500;
ViewState["aa"]="xx";
these are not strongly types ,only accept object and we have cast it before use it. //Session public int sEmpID { get { if ((Session["empID"] == null)) { return 0;//throw new applicationException("Session expired"); } else { return Convert.ToInt16(Session["empID"]); } } set { Session["empID"] = value; } } //ViewState public bool vsIsEdit { get { return Convert.ToBoolean(ViewState["IsEdit"]); } set { ViewState["IsEdit"] = value; } }
