Inline Modifying of Existing Tickets Form - C# on Linux Episode 25
Read full transcript 13 segments
-
We're getting close to wrapping up our We're getting close to wrapping up our ticket app on Linux. In this video, ticket app on Linux. In this video, ticket app on Linux. In this video, we're going to put in place a way to we're going to put in place a way to we're going to put in place a way to edit existing tickets. Now, this video edit existing tickets. Now, this video edit existing tickets. Now, this video is part of a series dedicated to is part of a series dedicated to is part of a series dedicated to developing C applications on Linux. developing C applications on Linux. developing C applications on Linux. Along the way, we've gained a better Along the way, we've gained a better Along the way, we've gained a better knowledge of how Linux works and how to knowledge of how Linux works and how to knowledge of how Linux works and how to make our apps truly crossplatform. If make our apps truly crossplatform. If make our apps truly crossplatform. If you haven't already, subscribe to this you haven't already, subscribe to this you haven't already, subscribe to this channel to stay informed of new episodes channel to stay informed of new episodes channel to stay informed of new episodes as they come out, as well as new series as they come out, as well as new series as they come out, as well as new series and new content. And if you're looking and new content. And if you're looking and new content. And if you're looking for even more NET SQL and C# training, for even more NET SQL and C# training, for even more NET SQL and C# training, go to imtimcorey.com. go to imtimcorey.com. go to imtimcorey.com. That's what funds this free content. That's what funds this free content. That's what funds this free content. Okay, let's jump over to Linux. We're Okay, let's jump over to Linux. We're Okay, let's jump over to Linux. We're going to work on our ticket. And what going to work on our ticket. And what going to work on our ticket. And what we're going to do is let's again work on we're going to do is let's again work on we're going to do is let's again work on the um the code first and then we'll go the um the code first and then we'll go the um the code first and then we'll go into working on the the HTML. So what into working on the the HTML. So what into working on the the HTML. So what we're going to do is let's put an extra we're going to do is let's put an extra we're going to do is let's put an extra line here and we're going to say private line here and we're going to say private line here and we're going to say private ticket update model and that's nullable ticket update model and that's nullable ticket update model and that's nullable and say edit ticket.
-
and say edit ticket. and say edit ticket. So this is the the model we'll use to So this is the the model we'll use to So this is the the model we'll use to edit the ticket. Now what we're going to edit the ticket. Now what we're going to edit the ticket. Now what we're going to do is I'm just going to show you real do is I'm just going to show you real do is I'm just going to show you real quick up here where we have each of our quick up here where we have each of our quick up here where we have each of our tickets listed. We're going to do a tickets listed. We're going to do a tickets listed. We're going to do a inline edit. So if you hit a button that inline edit. So if you hit a button that inline edit. So if you hit a button that says I want to edit, you know, one says I want to edit, you know, one says I want to edit, you know, one particular row, it's going to change particular row, it's going to change particular row, it's going to change from displaying the data to being an from displaying the data to being an from displaying the data to being an edit form. So that's what we're going to edit form. So that's what we're going to edit form. So that's what we're going to do. This will be the ticket that we work do. This will be the ticket that we work do. This will be the ticket that we work on. Um let's go ahead and put a a new uh on. Um let's go ahead and put a a new uh on. Um let's go ahead and put a a new uh method in here called private voidedit method in here called private voidedit method in here called private voidedit ticket. This is going to start the edit ticket. This is going to start the edit ticket. This is going to start the edit process. We're going to say ticket model process. We're going to say ticket model process. We're going to say ticket model ticket. Now, this model being passed in ticket. Now, this model being passed in ticket. Now, this model being passed in is whatever row you're on. That's what is whatever row you're on. That's what is whatever row you're on. That's what we're going to edit. So, that's the the we're going to edit. So, that's the the we're going to edit. So, that's the the data that's going to come in is a model data that's going to come in is a model data that's going to come in is a model from a a specific row. So, we're going from a a specific row. So, we're going from a a specific row. So, we're going to then populate our edit ticket equals to then populate our edit ticket equals to then populate our edit ticket equals new. And then we'll put curly braces new. And then we'll put curly braces new. And then we'll put curly braces here and not in the same line on the new here and not in the same line on the new here and not in the same line on the new line. There we go. Um the the same line line. There we go. Um the the same line line. There we go. Um the the same line would be like for JavaScript. This is C.
-
would be like for JavaScript. This is C. would be like for JavaScript. This is C. So, we're gonna say ID equals ticket do So, we're gonna say ID equals ticket do So, we're gonna say ID equals ticket do ID ID ID ticket title. ticket title. ticket title. Nope. There we go. Um, Nope. There we go. Um, Nope. There we go. Um, wow. So, when I say comma, it wants to wow. So, when I say comma, it wants to wow. So, when I say comma, it wants to put a autocomplete, which we don't want. put a autocomplete, which we don't want. put a autocomplete, which we don't want. Um, there we go. Ticket title Um, there we go. Ticket title Um, there we go. Ticket title equals ticket dot ticket title equals ticket dot ticket title equals ticket dot ticket title or empty string if it's a null value. or empty string if it's a null value. or empty string if it's a null value. And then ticket description equals And then ticket description equals And then ticket description equals ticket dot ticket description or empty ticket dot ticket description or empty ticket dot ticket description or empty string. string. string. And then we're going to say date And then we're going to say date And then we're going to say date completed equals ticket dot date completed equals ticket dot date completed equals ticket dot date completed completed completed and then priority equals ticket. and then priority equals ticket. and then priority equals ticket. priority. So this is taking the existing priority. So this is taking the existing priority. So this is taking the existing record and create a new record in the record and create a new record in the record and create a new record in the new structure, the new ticket update new structure, the new ticket update new structure, the new ticket update model with the values from the ticket model with the values from the ticket model with the values from the ticket we're going to edit. Okay, that's all we're going to edit. Okay, that's all we're going to edit. Okay, that's all we're going to do. That's going to then we're going to do. That's going to then we're going to do. That's going to then um allow us to edit the ticket.
-
um allow us to edit the ticket. um allow us to edit the ticket. So, and what we're going to do is we're So, and what we're going to do is we're So, and what we're going to do is we're going to um show or hide this based upon going to um show or hide this based upon going to um show or hide this based upon if this edit ticket is null or not. So if this edit ticket is null or not. So if this edit ticket is null or not. So that's all we need to do to start the that's all we need to do to start the that's all we need to do to start the process of making an edit. process of making an edit. process of making an edit. Now here we're going to say private Now here we're going to say private Now here we're going to say private async task async task async task saveedit async and this is we're going to and this is we're going to actually save this. So if uh edit ticket actually save this. So if uh edit ticket actually save this. So if uh edit ticket is null then we want to say no return is null then we want to say no return is null then we want to say no return because you can't you can't save because you can't you can't save because you can't you can't save something that's just null. Then we're something that's just null. Then we're something that's just null. Then we're going to have a try going to have a try going to have a try and we're going to say is saving equals and we're going to say is saving equals and we're going to say is saving equals true and error message equals null true and error message equals null true and error message equals null and then await ticket API.date and then await ticket API.date and then await ticket API.date Update ticket async edit ticket Update ticket async edit ticket Update ticket async edit ticket and then edit ticket and then edit ticket and then edit ticket equals null equals null equals null and then await load tickets async.
-
and then await load tickets async. and then await load tickets async. So we're going to make sure we can't do So we're going to make sure we can't do So we're going to make sure we can't do a double edit. We're going to clear out a double edit. We're going to clear out a double edit. We're going to clear out the error message. We're going to update the error message. We're going to update the error message. We're going to update the ticket. Let's put a line return the ticket. Let's put a line return the ticket. Let's put a line return there. And then once we've done the um there. And then once we've done the um there. And then once we've done the um the update, then we're going to set the the update, then we're going to set the the update, then we're going to set the edit ticket to null and refresh the page edit ticket to null and refresh the page edit ticket to null and refresh the page with um the the new information. So, with um the the new information. So, with um the the new information. So, let's go ahead and catch this let's go ahead and catch this let's go ahead and catch this exception ex. exception ex. exception ex. And like before, we're going to do the And like before, we're going to do the And like before, we're going to do the uh error message equals dollar sign uh error message equals dollar sign uh error message equals dollar sign failed to update ticket. failed to update ticket. failed to update ticket. and ex message. And again, we're going to have a finally And again, we're going to have a finally here. here. here. And what that's going to do is say is And what that's going to do is say is And what that's going to do is say is saving equals false, which again saving equals false, which again saving equals false, which again reenables those buttons. reenables those buttons. reenables those buttons. So that is the um the save edit async. So that is the um the save edit async. So that is the um the save edit async. So when we say yes, go ahead and save So when we say yes, go ahead and save So when we say yes, go ahead and save these edits, that's what's going to these edits, that's what's going to these edits, that's what's going to happen. And then we have one more method happen. And then we have one more method happen. And then we have one more method to do and that is private to do and that is private to do and that is private void cancel edit which is in line with our cancel update which is in line with our cancel update or cancel insert I think it cancel or cancel insert I think it cancel or cancel insert I think it cancel create that's what it is uh edit ticket create that's what it is uh edit ticket create that's what it is uh edit ticket equals null which again sets that to equals null which again sets that to equals null which again sets that to null which means it's going to hide the null which means it's going to hide the null which means it's going to hide the form. Okay. So, there's our save, form. Okay. So, there's our save, form. Okay. So, there's our save, there's our cancel, and there's our the
-
there's our cancel, and there's our the there's our cancel, and there's our the start of the process for editing. Okay. start of the process for editing. Okay. start of the process for editing. Okay. So, now let's um put this in line. So, So, now let's um put this in line. So, So, now let's um put this in line. So, let's come up here to our our body and let's come up here to our our body and let's come up here to our our body and we have this for each. we have this for each. we have this for each. Right now, we have Right now, we have Right now, we have this for every record. But instead, what this for every record. But instead, what this for every record. But instead, what we're going to do is we're going to an we're going to do is we're going to an we're going to do is we're going to an if statement. So, I'm going to cut this if statement. So, I'm going to cut this if statement. So, I'm going to cut this out for now and say at if edit ticket if out for now and say at if edit ticket if out for now and say at if edit ticket if it's not null ID equals ticket dot id. it's not null ID equals ticket dot id. it's not null ID equals ticket dot id. So, if a ticket's null then we skip this So, if a ticket's null then we skip this So, if a ticket's null then we skip this because if we can't check an ID equals because if we can't check an ID equals because if we can't check an ID equals this because it's definitely not that this because it's definitely not that this because it's definitely not that because um they don't match. So that's because um they don't match. So that's because um they don't match. So that's our if statement and then we're going to our if statement and then we're going to our if statement and then we're going to have an else here have an else here have an else here and then we're going to have our old and then we're going to have our old and then we're going to have our old code back. So there is um actually you code back. So there is um actually you code back. So there is um actually you know what I need to highlight all of know what I need to highlight all of know what I need to highlight all of these and and tab one and indent them.
-
these and and tab one and indent them. these and and tab one and indent them. So So So if the edit ticket is null we go to the if the edit ticket is null we go to the if the edit ticket is null we go to the else statement and just put the row. But else statement and just put the row. But else statement and just put the row. But if the edit ticket's not null and the ID if the edit ticket's not null and the ID if the edit ticket's not null and the ID matches the ticket ID of this particular matches the ticket ID of this particular matches the ticket ID of this particular row, then show the edit form. Otherwise, row, then show the edit form. Otherwise, row, then show the edit form. Otherwise, just show the row. Okay. So, we're going just show the row. Okay. So, we're going just show the row. Okay. So, we're going to need a a row here. So, we're going to to need a a row here. So, we're going to to need a a row here. So, we're going to say tr and then we're going to say TD, say tr and then we're going to say TD, say tr and then we're going to say TD, which is add ticket ID because we're not which is add ticket ID because we're not which is add ticket ID because we're not going to allow the editing of the ID. going to allow the editing of the ID. going to allow the editing of the ID. But then we're going to have a TD and But then we're going to have a TD and But then we're going to have a TD and we're have an input text we're have an input text we're have an input text and say class equals and say class equals and say class equals form form form form control form control form control and then we'll have a atbind and then we'll have a atbind and then we'll have a atbind dash value equals to edit ticket dash value equals to edit ticket dash value equals to edit ticket title.
-
title. title. And let's unpin this or close that so we And let's unpin this or close that so we And let's unpin this or close that so we can actually see this. And then can actually see this. And then can actually see this. And then self-close this row or this is input. So self-close this row or this is input. So self-close this row or this is input. So that's going to be the the edit field that's going to be the the edit field that's going to be the the edit field for uh for this. And then what we'll do for uh for this. And then what we'll do for uh for this. And then what we'll do is we will have a another TD. is we will have a another TD. is we will have a another TD. And in fact, let me just copy this and And in fact, let me just copy this and And in fact, let me just copy this and paste it because it's typing is paste it because it's typing is paste it because it's typing is annoying. um ticket description. So then we have our one more basically So then we have our one more basically input number and then we will have our date created. and then we will have our date created. We're not going to mess with so we're We're not going to mess with so we're We're not going to mess with so we're going to say um TD and say ticket.reated going to say um TD and say ticket.reated going to say um TD and say ticket.reated created I'm sorry uh created if it's not null then uh to short date if it's not null then uh to short date string like so like you did before um string like so like you did before um string like so like you did before um and then we're going to have another and then we're going to have another and then we're going to have another input so we'll paste this in but it's is input so we'll paste this in but it's is input so we'll paste this in but it's is input date input date input date which is a form control we're going to which is a form control we're going to which is a form control we're going to say date completed so you can modify say date completed so you can modify say date completed so you can modify that as a date picker that as a date picker that as a date picker And um you know we we could say no I
-
And um you know we we could say no I And um you know we we could say no I just want to say you know a checkbox just want to say you know a checkbox just want to say you know a checkbox says incomplete. We could do that. I'm says incomplete. We could do that. I'm says incomplete. We could do that. I'm just going to let you pick the date just going to let you pick the date just going to let you pick the date because maybe you did complete it because maybe you did complete it because maybe you did complete it yesterday or or tomorrow. Um if you yesterday or or tomorrow. Um if you yesterday or or tomorrow. Um if you wanted to have a checkbox you could do wanted to have a checkbox you could do wanted to have a checkbox you could do that. Um, and then what you do is you that. Um, and then what you do is you that. Um, and then what you do is you would have in your your method down would have in your your method down would have in your your method down below before you modify anything, you below before you modify anything, you below before you modify anything, you would check that value and say, "Oh, if would check that value and say, "Oh, if would check that value and say, "Oh, if that's checked, then put datetime dot that's checked, then put datetime dot that's checked, then put datetime dot UTC now or or you know, um, yeah, UTC UTC now or or you know, um, yeah, UTC UTC now or or you know, um, yeah, UTC now." So, but we're just going to allow now." So, but we're just going to allow now." So, but we're just going to allow you to pick the date. you to pick the date. you to pick the date. And then I'm going to want And then I'm going to want And then I'm going to want uh a TD here with a button uh a TD here with a button uh a TD here with a button type equals button type equals button type equals button and class equals btn and btn and class equals btn and btn and class equals btn and btn small and btn success small and btn success small and btn success and margin end of two and margin end of two and margin end of two and disabled equals you probably should and disabled equals you probably should and disabled equals you probably should be familiar with this by now at is be familiar with this by now at is be familiar with this by now at is saving And then let's actually put this on the And then let's actually put this on the new line.
-
new line. new line. Indent it and say uh at on click equal Indent it and say uh at on click equal Indent it and say uh at on click equal to save edit async. to save edit async. to save edit async. And we'll call this uh save. Not Dave. And we'll call this uh save. Not Dave. And we'll call this uh save. Not Dave. Save. Save. Save. There we go. Um sorry Dave. So then we There we go. Um sorry Dave. So then we There we go. Um sorry Dave. So then we want want one more button. So, let's want want one more button. So, let's want want one more button. So, let's just copy this button because it's the just copy this button because it's the just copy this button because it's the same basic structure. Uh, but instead of same basic structure. Uh, but instead of same basic structure. Uh, but instead of success, we're going to say secondary. success, we're going to say secondary. success, we're going to say secondary. Um, and it won't put a margin end on it Um, and it won't put a margin end on it Um, and it won't put a margin end on it because it's a second button. And we're because it's a second button. And we're because it's a second button. And we're going to say this is cancel edit. going to say this is cancel edit. going to say this is cancel edit. And we're going to say cancel. And we're going to say cancel. And we're going to say cancel. Now, notice I did put one more row than Now, notice I did put one more row than Now, notice I did put one more row than I have in my um in my create. Well, I'm I have in my um in my create. Well, I'm I have in my um in my create. Well, I'm actually going to put an empty row here. actually going to put an empty row here. actually going to put an empty row here. Th Th Th don't I don't need to worry about don't I don't need to worry about don't I don't need to worry about putting a um you know, a title in here.
-
putting a um you know, a title in here. putting a um you know, a title in here. I could put like actions or something I could put like actions or something I could put like actions or something like that. I'm going to leave it alone. like that. I'm going to leave it alone. like that. I'm going to leave it alone. And down below, I'm going to put one And down below, I'm going to put one And down below, I'm going to put one more TD. more TD. more TD. And here I'm gonna put button type And here I'm gonna put button type And here I'm gonna put button type equals actually you know what let's just equals actually you know what let's just equals actually you know what let's just paste it in. Cool. Um btn btn small uh paste it in. Cool. Um btn btn small uh paste it in. Cool. Um btn btn small uh let's do instead of successful primary let's do instead of successful primary let's do instead of successful primary and still uh margin end and disabled is and still uh margin end and disabled is and still uh margin end and disabled is is saving and on click we're going to is saving and on click we're going to is saving and on click we're going to actually call a method. So, we're going actually call a method. So, we're going actually call a method. So, we're going to do uh empty um par parenthesis and to do uh empty um par parenthesis and to do uh empty um par parenthesis and say arrow and say edit ticket say arrow and say edit ticket say arrow and say edit ticket and pass in the ticket that we're and pass in the ticket that we're and pass in the ticket that we're currently on. And we'll call this the currently on. And we'll call this the currently on. And we'll call this the edit button. edit button. edit button. All right. So, if we're not, you know, All right. So, if we're not, you know, All right. So, if we're not, you know, we can always edit a road by hitting the we can always edit a road by hitting the we can always edit a road by hitting the edit button. So, um with that, I think edit button. So, um with that, I think edit button. So, um with that, I think we're we're good. Let's hit save and we're we're good. Let's hit save and we're we're good. Let's hit save and let's try us out. Um, you can see what I let's try us out. Um, you can see what I let's try us out. Um, you can see what I was talking about. Uh, wait for it to was talking about. Uh, wait for it to was talking about. Uh, wait for it to build. Um, and make sure that, you know, build. Um, and make sure that, you know, build. Um, and make sure that, you know, I've thought through all the processes.
-
I've thought through all the processes. I've thought through all the processes. Okay, loading up. Okay, loading up. Okay, loading up. There we go. It's a little slow. There we go. It's a little slow. There we go. It's a little slow. So, it's running. It's healthy. We go So, it's running. It's healthy. We go So, it's running. It's healthy. We go tickets. We now have an edit button tickets. We now have an edit button tickets. We now have an edit button after each of them. So, let's edit um my after each of them. So, let's edit um my after each of them. So, let's edit um my third ticket. Um hit edit. And notice we third ticket. Um hit edit. And notice we third ticket. Um hit edit. And notice we now have a save and cancel button. And now have a save and cancel button. And now have a save and cancel button. And we actually have the ability to edit we actually have the ability to edit we actually have the ability to edit these three things. Now, as far as CSS these three things. Now, as far as CSS these three things. Now, as far as CSS goes, I'd probably want to center these goes, I'd probably want to center these goes, I'd probably want to center these two things. I haven't done that, but um two things. I haven't done that, but um two things. I haven't done that, but um let's put exclamation point after third let's put exclamation point after third let's put exclamation point after third ticket. This is a medium ticket with a ticket. This is a medium ticket with a ticket. This is a medium ticket with a period at the end. And let's change the period at the end. And let's change the period at the end. And let's change the priority down to uh four. Um, and then priority down to uh four. Um, and then priority down to uh four. Um, and then the month, day, year. Let's let's choose the month, day, year. Let's let's choose the month, day, year. Let's let's choose that we closed it uh on the 8th and hit that we closed it uh on the 8th and hit that we closed it uh on the 8th and hit save. There you go. Exclamation point save. There you go. Exclamation point save. There you go. Exclamation point period at the end for uh date closed. If period at the end for uh date closed. If period at the end for uh date closed. If I go back and come back, yes, it is in I go back and come back, yes, it is in I go back and come back, yes, it is in the uh in the data. So, we made a the uh in the data. So, we made a the uh in the data. So, we made a change. Let's make this change back um change. Let's make this change back um change. Let's make this change back um because we want to make sure that yes, because we want to make sure that yes, because we want to make sure that yes, it's a a medium table. So, it's three.
-
it's a a medium table. So, it's three. it's a a medium table. So, it's three. Um, that's it. So, now we have edits in Um, that's it. So, now we have edits in Um, that's it. So, now we have edits in place. place. place. If you if you realize I put a margin end If you if you realize I put a margin end If you if you realize I put a margin end here, I think you'll know what's coming here, I think you'll know what's coming here, I think you'll know what's coming next. So, in the next video, we're going next. So, in the next video, we're going next. So, in the next video, we're going to put a delete button here that allows to put a delete button here that allows to put a delete button here that allows us to delete a record. That's coming up us to delete a record. That's coming up us to delete a record. That's coming up next. Until then, the code for this is next. Until then, the code for this is next. Until then, the code for this is down in the description. So, check it down in the description. So, check it down in the description. So, check it out if you want to get the latest out if you want to get the latest out if you want to get the latest version of the code. Thanks for watching version of the code. Thanks for watching version of the code. Thanks for watching and as always I am Tim Corey
Summary
This tutorial focuses on adding an inline editing feature to a ticket application being developed in C on Linux. The process involves creating an edit ticket model and transforming rows from displaying data to editable forms upon user interaction. The takeaway is the practical implementation of dynamic UI updates for ticket modification within a cross-platform C application.