Skip to content

Added and Delete Note Buttons#1677

Open
Jonimz wants to merge 11 commits intodevelopmentfrom
Add-and-Delete-Buttons
Open

Added and Delete Note Buttons#1677
Jonimz wants to merge 11 commits intodevelopmentfrom
Add-and-Delete-Buttons

Conversation

@Jonimz
Copy link
Contributor

@Jonimz Jonimz commented Feb 18, 2026

Issue Description

Fixes #1630

  • Add issue description
    This update allows users to edit an existing note using the same modal that is used to add a new note.
    When a user clicks Edit, the modal now opens with the note’s:
    Text already filled in
Screenshot 2026-02-18 at 3 26 47 PM

Changes

Added logic so clicking Edit opens the modal with the note’s current information.
Fixed the edit button’s data-* attributes so they match the correct model fields.
If editing, the old note is deleted.
The updated version is saved as a new note.
Screenshot 2026-02-18 at 3 26 58 PM

Note Editing
Go to My Profile under Event List.
Create a note and save
Click Edit on the existing note.
Confirm the updated text appears correctly.
Click save.
Confirm the updated note appears correctly.

@Meatchema Meatchema self-requested a review February 18, 2026 21:03
@Meatchema
Copy link
Contributor

The looks of the edit and delete buttons are in a bit of an odd position. I think it may be best to have a drop down tab for each note that is present so that the buttons aren't smash together;

image

I have also recieved this error when trying to click on the edit button for the note.
image

@ojmakinde ojmakinde assigned ojmakinde and Jonimz and unassigned ojmakinde Feb 20, 2026
Copy link
Contributor

@ojmakinde ojmakinde left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great, but a few changes were suggested. Also, two things:

  • On smaller screens, the Edit and Delete button have no spacing (image below). We can use custom Bootstrap to help with that.
Image
  • Secondly, on a large screen, if you add a note that is long enough, the formatting of the Edit and Delete buttons become messed up (image for before and after).
Image Image
  • Lastly, if a note is long enough, the content gets cut half way. In the image example below, I have a write up. When I save the note, not all the content in the write up is saved.
Image

After saving:

Image

Comment on lines +194 to +196
$("#addNoteTextArea").val('') // clear the text
$("#notesSaveButton").data('mode', 'add') // set mode to add
$("#notesSaveButton").data('noteid', null) // clear any stored noteid
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also, i don't think the comments here are necessary. can we remove them?

Copy link
Contributor

@ojmakinde ojmakinde left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great, but a few changes were suggested. Also, two things:

  • On smaller screens, the Edit and Delete button have no spacing (image below). We can use custom Bootstrap to help with that.
Image
  • Secondly, on a large screen, if you add a note that is long enough, the formatting of the Edit and Delete buttons become messed up (image for before and after).
Image Image
  • Lastly, if a note is long enough, the content gets cut half way. In the image example below, I have a write up. When I save the note, not all the content in the write up is saved.
Image

After saving:

Image

Copy link
Contributor

@ojmakinde ojmakinde left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Two last things:

  • Currently, if you hit the delete button for a note, there is no modal confirmation for deleting. If a user clicks the Delete button on accident, they may accidentally delete a note. I believe we have delete modals in other places you can import and use.

  • Small nit, but the modal stores the content after a note is created. Ideally, the textbox should only keep the text (arguably) if a note is not created. Example below:

Creating a note:
Image

Created note:
Image

Hitting the edit button and reopening the modal:
Image

This should be a brief fix, but if it takes more than an hour or two, I'm fine with either identifying and fixing it, or merging it straight altogether. Great work.

Copy link
Contributor

@Meatchema Meatchema left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello, something that I noticed is that the Edit button is about half the size as the delete button which should probably be adjusted. I also tested out how much text can be accepted now that you changed the code from CharField to TextField() as well as changing noteContent to Text. This should allow for extended text but for some reason it doesn't.

Image I am wondering if you would need to change the code of the box itself so that it expands as the text gets larger.

Next, I tested the button stacking issue and it is no longer there. Nice!

Image

Other than the size of the edit button and the long text issue, all basic functions work.

$("#noteDropdown").val(visibility)


if (isBonner === 'yes') {
Copy link
Contributor

@MImran2002 MImran2002 Mar 7, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

According to the issue description: As of now, when we create a Bonner note on the User Profile page in the Bonner Program accordion, there is no ability to edit or delete the note. Add such abilities.

My Feedback: You did well with Notes section for User profile, congratulations on that. You have implemented the edit/delete button but in the Bonner Section's note there isn't still the edit/delete button option which the issue description wants you to do so I would want you to implement that too so that it fits well with the issue description.

image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Resolved

bonnerNoteOff()
}

$("#notesSaveButton").data('noteid', $(this).data('noteid'))
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Image

As the picture said I feel like the title of the modal should reflect add Bonner Note instead of Add note which is for the note section

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Resolved

@Jonimz Jonimz force-pushed the Add-and-Delete-Buttons branch from 2a82a86 to 42c9a7e Compare March 10, 2026 16:42
@github-actions
Copy link

View Code Coverage

@Meatchema Meatchema self-requested a review March 11, 2026 19:36
Copy link
Contributor

@Meatchema Meatchema left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The notes box is now working properly to adjust to longer messages without cuttoffs after submission.

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add Edit and Delete buttons to the Bonner notes in the Bonner Program accordion on User Profile page

4 participants